I've been fighting the battle to gain an understanding of CSS. If I may be honest, It has been difficult to grasp. The idea of basic selectors is an easy concept, but as with anything in the world of development, the road to mastery will take you some time.
So.....basic selectors with CSS. You can select the element simply by the tag that you're wanting to manipulate. A 'p' tag in html could be identified in CSS by simply referring to that element like so:
p {
text-align:center
}
This works but you would have to be satisfied with ALL text that sits in between an open and closed pair of p tags to have all the text centered. While this could work, if thats what you're aiming for, chances are you would want to be a bit more specific in which p tags you want to be affected by the written CSS. This could be achieved through and id attribute or a class attribute set to the tag.
<p class='make-me-pretty'></p>
or
<p id='make-me-pretty'></p>
The first example of the above code block shows the p tag having a class attribute. Since it's allowed to have multiple HTML tags with the same class attribute, this could result in a way for you to apply more changes to how the the HTML would appear with less lines of code. The other example shows the p tag with an id attribute. The id attribute is a bit more restrictive since an id can only be unique, meaning that there couldn't be two html elements with an id of make-me-pretty. They both have their uses. I've found that classes help make for less code when you want to affect many things in the same way. An id attribute also has its use as well, given that you only want to apply a particular change to a particular element. Taking the plunge into CSS hasn't been too bad of a trial, and I know that at the other end of this I'll be a better, more rounded, developer. Next week we'll discuss some CSS combinators. I'll see you then and Happy Coding!.
Top comments (0)