Book HomeCascading Style Sheets: The Definitive GuideSearch this book Monday 23rd of October 2017 02:43:34 AM

10.5. Adapting to the Environment

CSS2 offers the ability to both alter the browser's environment and integrate its look more closely to that of the user's operating system.

H1 elements to have 10 pixels of padding on all sides, it's this easy, as the result shown in Figure 7-56 makes clear:

H1 {padding: 10px; background-color: silver;}
Figure 7-56

Figure 7-56. Padding applied to an H1 element

On the other hand, we might want H1 elements to have uneven padding and H2 elements to have regular padding, as shown in Figure 7-57:

H1 {padding: 10px 0.25em 3ex 3cm;} /* uneven padding */

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

PRE, with whitespace and returns preserved. nowrap prevents an element from line breaking.


TD {white-space: nowrap;}
TT {white-space: pre;}
widthIE4 P/Y IE5 P/Y NN4 P/P Op3 Q/-

Used to set the width of an element. This is most often applied to images, but can be used on any block-level or replaced element. Negative values are not permitted. back to why setting a color is a good idea later on in the chapter.

A background image can be applied to any element, whether block-levelor inline. BODY is the most common element towhich backgrounds are applied, of course, but there's no needto stop there. For example:

P.starry{background-image: url(;color: white;}<P CLASS="starry">It's the end of autumn, which means the stars will be
H1 {color: gray;}   /* This CSS comment is several lines */H2 {color: silver;} /* long, but since it is alongside */P {color: white;}   /* actual styles, each line needs to */PRE {color: gray;} /* be wrapped in comment markers. */

Given this example, if each line isn't marked off, then most ofthe style sheet will become part of the comment, and so will notwork:

H1 {color: gray;}   /* This CSS comment is several linesH2 {color: silver;}   long, but since it is not wrapped

The simplest category of XML Java applications is the kind of Java application that stores information in XML documents (files). This is illustrated in Figure 1. By using XML to create your own markup languages (i.e. your own file formats for your information) in an open way, you don't have to use propietary and binary file formats. Using XML over proprietary binary file formats, allows your applications to have immense inter operability across platforms, applications and even programming languages. Since any kind of markup language can be defined using XML (you can even formalize it by creating a DTD for it) applications can store their information using their own markup languages. For example, address book information can be stored in an AddressBookML file. A few commercial programs currently available allow saving their application data to XML files, e.g., Framemaker can save its documents as XML files.

In order to create applications of this category, you might have to define a DTD for your information. Then you have to write classes to import and export information from your XML document(s) (validating using your application's DTD if you have one). You must also write the classes which create the user interface in your application. The user of your application can view and modify information using the GUI (graphical user interface), and they can save (and load) their information to (and from) an XML file (that might use your DTD); in other words, they can save (and load) their information to (and from) an ApplicationML file (where Application is the name of your application). Some examples are AddressBookML, MathML, SVGML, etc.

The classes that import and export information from your ApplicationML file must use the parser and SAX or DOM API in order to import the information. These classes can access this information by using one of the following strategies:

  1. Use DOM to directly manipulate the information stored in the document (which DOM turns into a tree of nodes). This document object is created by the DOM XML parser after it reads in the XML document. This option leads to messy and hard-to-understand code. Also, this works better for document-type data rather than just computer generated data (like data structures and objects used in your code).
  2. Negative margins

    So far, this probably all seems ratherstraightforward, and you may be wondering why I said things could becomplicated. As it turns out, the complication is that margins canhave negative values.

    You'll remember that I said the second-simplest rule ofhorizontal formatting was this: the total of the seven horizontalproperties always equals the width of the parentelement. At first glance, this can be interpreted to mean that an