HTML, CSS, & JavaScript All-in-One For Dummies

Chapter 2

Getting to Know the CSS Selectors

IN THIS CHAPTER

Figuring out parents, children, siblings, and other CSS kinfolk

Understanding why selectors are so darned important

Selecting elements by type, class, or id

Targeting child and sibling elements

Selecting elements by attribute

Perhaps the biggest key to understanding CSS is understanding selectors.

—CHRIS COYIER

In Book 1, Chapter 1, I mention that one way to add CSS to a page is to insert the style attribute into whatever HTML tag you want to modify. That works, but it's really only workable for the teensiest web pages. If your web projects go even a little beyond putting “Hello World!” in an h1 element, it’s light years more efficient to plop your CSS rules inside either an internal stylesheet (using the head section’s <style> tag) or an external stylesheet (using a separate .css file).

When you go the stylesheet route (be it internal or external), it becomes crucial that each CSS rule applies only to the page elements ...