#idselector

[abdelfattah-ragab]

CSS Selectors and Specificity by Abdelfattah Ragab

CSS Selectors and Specificity by Abdelfattah Ragab

Welcome to the book "CSS Selectors and Specificity". In this book, I explain the different types of selectors, from simple element selectors to advanced attribute selectors and pseudo-classes. You will understand how specificity and cascading work and how to write CSS rules that deliver predictable and desired results. By the end of this book, you will be confident in using CSS selectors and have mastered all possible scenarios. Let’s go!

Available on https://shop.tredition.com and https://www.amazon.com

[ictvibe]

BE CAREFUL!

November 16-20, 2020 (Week 5)

      Another week has passed therefore a new blog has arrived! Welcome, folks! Miss me? Nah, just kidding! So are you, guys ready for some new learnings? If yes, then giddy up and scroll it down!

So for this week, I’ll be sharing new, fun, and exciting learnings! Quiz week has passed and lesson week has arrived! For this blog, I’ll be sharing to you guys all that I have learned in CSS2.

Firstly, I want you guys to get familiarized with these terms because you might encounter with as you read the blog.

Embedded - The style is defined within the <style> tags for the HTML document.

Inline - The style is defined for a specific HTML element.

External - The style is defined in an external file.

Okay so let’s start (for real this time lol)! So for our starter, Sir Richard introduced those words I wanted you guys to be familiarized with to us. He let us open the HTML file we made weeks ago and edited it for us to learn the codes first hand. He made us edited some elements and tags for us to learn its uses and the difference it will make if a wrong value was added.

The first one that we edited was a file called External Style Sheets. I must admit that I had a hard time editing it because it has an external css file which confused me. I didn’t know if I should edit it on the HTML file directly or if should I edit it on the external link. But I did the latter, just to be safe. I asked Sir Richard if where is the right file to edit it, if on the HTML file directly or in the external file, and he said that either of the two will do. 

In this HTML file, we did some class style which is done by doing this .classname { style rules; }. This type of style can be applied to individual tags when needed. We also added the ID selector which is done by doing #IDselector { declaration }. By using this, you can choose the style for the element by assigning a unique id. And lastly, we added the <span></span> tag which is used to style only a selected portion of text. 

Difficult, you might think, but actually, yeah not gonna lie but it is actually difficult to understand HAHAHA! So if you can’t fully understand it, here’s a pic to help you! I won’t go details in details here since I don’t want this to be a tutorial blog.

     So for the second file that we edited, it has a file name called Layers. Sir Richard made us understand how the elements here are being positioned and their sizes. We must be really careful around with these elements because one wrong size or position, your file will be messed up! We didn’t change anything here, we just experimented with the sizes and position but lemme show you a pic on how did it started and how we experimented with it.

And oh I almost forgot, I think I must show you the changes in the external css file that I edited. There isn’t much to learn here but I think it would be best if I show to you guys, right?

So as again guys, I wont go details in details with our lesson but if you want to learn more, you can comment on my post or message me here! I’ll try to reply as fast as I can but I can’t promise you anything since I also have a really busy schedule. So what will you guys do this weekend? Well for me, I have to rate my classmates blog this weekend because first quarter is about to end and we will do a peer rating on all our blogs one by one! I’m kinda anxious because my blog is really simple but I think I passed some of the criterias. Well, let’s just hope for the best but expect less HAHAHA ironic, right?

So imma go wrap it all up here guys! See you next week for a new blog! 

STAY SAFE AND LET'S LEARN TOGETHER!