Selecting Elements Based on Attributes


You can also apply formatting to those elements that have a given attribute or attribute value.

Figure 9.35. In this code, only the two inner div elements have class attributes.


To select elements to format based on their attributes:

1.

If desired, type element, where element is the selector for the element whose attributes are in question.

2.

Type [attribute, where attribute is the name of the attribute that an element must have to be selected.

3.

If desired, type ="value" if you want to specify the value that the attribute must have for its element to be selected.

Or, if desired, type ~="value", to specify a value that the attribute can contain (along with other content) for its element to be selected.

Or, if desired, type | (the pipe symbol) ="value" to specify that the attribute's value begin with value- (that is, what you typed followed by a hyphen) in order for its element to be selected. (This is most common when searching for elements in a particular language.)

4.

Type ] (Figure 9.36).

Figure 9.36. The square brackets enclose the desired attribute and any desired value.


Tip

  • Selecting elements based on the attributes (and values) they contain is supported by all current major browsers (including IE as of version 7).

    Figure 9.37. Every div element that contains a class attribute, regardless of the class's value, is red.





HTML, XHTML, & CSS(c) Visual QuickStart Guide
HTML, XHTML, and CSS, Sixth Edition
ISBN: 0321430840
EAN: 2147483647
Year: 2004
Pages: 340

Similar book on Amazon

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net