Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Selectors Review2:15 with Guil Hernandez
In this lesson, we'll review what we’ve learned so far about CSS Selectors.
[male speaker] Let's go over what we've learned so far about CSS selectors.
A type, or element selector is what we use to select a type of element on the page,
like the body or a heading, so we use the HTML tag as the selector.
Classes can be reused anywhere in the HTML and an element can have more than one class.
It's also a good practice to give classes meaningful names that explain their purpose.
When using IDs keep in mind that they are not reusable.
An element can only have one ID, and a page can only have one element with the same ID name,
but they can also be used as fragment identifiers for creating anchors and pages.
We can also create descendant selectors to target elements that are descendants of other elements.
Additionally, we can use the greater than sign, plus sign, or tilde symbol as combinators to target direct child and sibling elements.
Remember the DRY concept: Don't Repeat Yourself.
So if we have code that is repeated multiple times throughout the style sheet it's a good idea to refactor the CSS
so that each property and value pair is defined only once.
We can use pseudo-class selectors to style elements based on user interaction like on the hover or focus state of a link.
We can also target UI element states like the checked enabled or disabled state of a checkbox.
With structural pseudo-classes we can write more efficient CSS
because we're able to target elements based on their position in the HTML.
For example, the first child and last child pseudo-classes let us target the fist and last child of a parent element,
but we can also get really specific with nth child, where we use expressions to target a combination of child elements.
Finally, with pseudo-elements we can target virtual elements and insert generated content in our HTML from our CSS.
Throughout the first three stages we used certain CSS properties and values to style the elements we selected.
We'll learn all about those coming up next in values and units.
You need to sign up for Treehouse in order to download course files.Sign up