Adapting to Web Standards

Book Notes by Julaine

Adapting to Web Standards: CSS and Ajax for Big Sites

CSS Selectors

  
#myid ID selector  Matches any E element ID equal to myid
#myid {color: red;}
Text inside will be red.
 
 
E F Descendant selector  Matches any F element that is a descendant of an E element

This text is red.

This text is not.

 
 
E > F Child selector  Matches any F element that is a direct child of an element E. White space around > is optional.
li > p { color: red; }
 
 

  • This text is red.

 
 

This text is not.

 
 
E + F Adjacent selector Matches any F element immediately preceded by an element E
h1 + p { color: red; }

Header

Paragraph is red.

But not this one!

 
 
E:first-child The :first-child pseudo-class  Matches element E when E is the first child of its parent
li:first-child { color:red; }
  • this will be red
  • this will not be
 
 
E:link :link pseudo-class Matches elements E that are links, typically a anchor links in (X)HTML
 
This is blue.
 
 
 
E[foo] Attribute selector Matches any E element with the foo attribute set (whatever the value)
a[href] {color:green;}
 
this, is not
 
 
 
E[foo=val] Attribute selector Matches any E element with the foo attribute set exactly to “val”
a[rel=external] { color: green; }
 
 
 
 
E[foo~=val] Attribute selector  Matches any element E with an attribute matching foo exactly in a space-separated list
a[rel~=example] {color: green;}
 
 
 
 
E[foo|=val] Attribute selector  Matches any element E with the foo  attribute set where the first part of a hyphenated value is “val”. This is typically for language attribute matching.
 
 
The title of book is in a white box with an orange background.

Cover of the book Adapting to Web Standards

Adapting To Web Standards: CSS and Ajax for Big Sites
by  Christopher Schmitt, Ethan Marcotte ISBN 0321501829
2007, New Riders Publishing Company

These are notes I made after reading this book. See more book notes

Just to let you know, this page was last updated Saturday, Dec 21 24