Classes

Besides elements, you can create selectors using classes. Here's an example. In this case, I'll create a class named RED that specifies that elements it's applied to must use a foreground (text) color of red and a background color of pink; to define a general class such as RED , you must preface it with a dot ( . ), as in .RED :

Listing ch09_06.css
 TITLE {display: block; font-size: 24pt; font-weight: bold; text-align: center; text-decoration: underline} AUTHOR {display: block; font-size: 18pt; font-weight: bold; text-align: center} SECTION {display: block; font-size: 16pt; font-weight: bold; text-align: center; font-style: italic} P {display: block; margin-top: 10}  .RED {color:red; background-color: pink}  

To apply this class to an individual element, such as the <TITLE> element in our XML document, I can add a CLASS attribute to that element, assuming that the browser I'm using can understand that attribute:

Listing ch09_07.xml
 <?xml version="1.0" standalone="yes"?> <?xml-stylesheet type="text/css" href="ch09_06.css"?> <DOCUMENT>  <TITLE CLASS="RED">The Meditations</TITLE>  <AUTHOR>By Marcus Aurelius</AUTHOR>     <SECTION>Book One</SECTION>     <P>         From my grandfather, Verus, I learned good morals         and the government of my temper.     </P>     <P>         From the reputation and remembrance of my father,         modesty and a manly character.     </P>     <P>         From my mother, piety and beneficence, and abstinence,         not only from evil deeds, but even from evil         thoughts; and further, simplicity in my way of living,         far removed from the habits of the rich.     </P>     <P>         From my great-grandfather, not to have frequented         public schools, and to have had good teachers at home,         and to know that on such things a man should spend         freely.     </P> </DOCUMENT> 

Browsers such as Internet Explorer understand the CLASS attribute, so you can see what this document looks like in Figure 9-5.

Figure 9-5. Using style classes.

graphics/09fig05.gif

Note that if you want to make this a valid document, you must declare the CLASS attribute. That might look like this in a DTD:

 <!ELEMENT TITLE (CDATA)*>  <!ATTLIST TITLE CLASS CDATA #IMPLIED> 

You can also create classes that apply only to specific elements. For example, here's how I style the first paragraph in a document to add some space before that paragraph, creating a class named TOP that applies only to <P> elements. I specify this by calling this class P.TOP (note that general classes such as RED apply to all elements, which is why you declare them as .RED ):

Listing ch09_08.css
 TITLE {display: block; font-size: 24pt; font-weight: bold; text-align: center; text-decoration: underline} AUTHOR {display: block; font-size: 18pt; font-weight: bold; text-align: center} SECTION {display: block; font-size: 16pt; font-weight: bold; text-align: center; font-style: italic} P {display: block; margin-top: 10}  P.TOP {display: block; margin-top: 30}  

Now I can use this new class with the first paragraph in the document:

Listing ch09_09.xml
 <?xml version="1.0" standalone="yes"?> <?xml-stylesheet type="text/css" href="ch09_08.css"?> <DOCUMENT>     <TITLE>The Meditations</TITLE>     <AUTHOR>By Marcus Aurelius</AUTHOR>     <SECTION>Book One</SECTION>  <P CLASS="TOP">  From my grandfather, Verus, I learned good morals         and the government of my temper.     </P>     <P>         From the reputation and remembrance of my father,         modesty and a manly character.     </P>     <P>         From my mother, piety and beneficence, and abstinence,         not only from evil deeds, but even from evil         thoughts; and further, simplicity in my way of living,         far removed from the habits of the rich.     </P>     <P>         From my great-grandfather, not to have frequented         public schools, and to have had good teachers at home,         and to know that on such things a man should spend         freely.     </P> </DOCUMENT> 

You can see the results in Figure 9-6.

Figure 9-6. Styling just one paragraph.

graphics/09fig06.gif



Real World XML
Real World XML (2nd Edition)
ISBN: 0735712867
EAN: 2147483647
Year: 2005
Pages: 440
Authors: Steve Holzner

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