CSS: Inline Styles

By Richard York

The last method for including CSS in a document is from within the XHTML elements themselves. Sometimes it doesn’t make sense to clutter your external or embedded style sheets with a rule that will be used on only one element in one document. This is where the style="" attribute comes into play; it’s demonstrated by the following markup:

This method allows for the text to be formatted from within the 
document and may be applied to any rendered element.
The following Try It Out demonstrates how the style attribute is used to add styles directly to the 
elements of a web document.
Try It Out-Including CSS Using the 
style Attribute 

Example 2-10. To use the style 
attribute to apply styles directly to the elements of a document, follow these 
steps.

 
Return to your text editor and enter the following  XHTML:
 
 
Save the preceding document as Example_2-10.html 
 
Load up Example 2-10 in your favorite browser. You should  see output like that in Figure 2-6.
 
How It Works 
Note that the output is identical to output of the earlier  example shown in Figure 2-6. The style attribute  allows CSS declarations to be included directly in the XHTML element. The style attribute, however, is not as dynamic as a style sheet.  It gives you no way to group repetitive rules or declarations. The style attribute should only be used when a more efficient  method is not available (if, for example, the element to be styled does not  appear on multiple pages).