| Although CSS means never having to set the appearance of each tag individually, you still have the freedom to set styles within individual tags, referred to as an inline style (Figure 2.3). This is especially useful if you've set styles for the page in the head or in an external style sheet, and you need to override them on a case-by-case basis. Figure 2.3. The general syntax for defining styles directly in an HTML tag. 
In this example (Figure 2.4), the styles have been added directly to several HTML tags, including the H1 tag used for the book title. Figure 2.4. The styles have been placed directly into the tags. 
To set the style properties of individual HTML tags: | | 1. | <h1 style=
Type style= in the HTML tag you want to apply styles to (Code 2.1).
Code 2.1. Each tag receives instructions on how the content within it should behave, by means of the style attribute. | 2. | "font:small-caps bold italic 2.5em Georgia, 'Times New Roman', times, serif; color: red; "
In quotes, type your style declaration(s) as property: value, using a semicolon (;) and separating individual declarations. Make sure to close the declaration list with quotation marks.
| 3. | > Alice's Adventures in Wonderland' </h1>
After closing the tag, add the content to be styled. Then close the tag pair with the corresponding end tag.
|
 Tips
If you are adding styles to a non-closing tag, such as an image tag, and you're using XHTML, you will need to make the tag self closing. So, rather than: <img src="/books/3/292/1/html/2/myImage.png"> You would use: <img src="/books/3/292/1/html/2/myImage.png" />
Although you do not gain the benefit of the universal style changes, using CSS in individual HTML tags is nevertheless very useful when you want to override universally defined styles. (See "Determining the Cascade Order" later in this chapter.) I've also shown how you can define the <body> tag in this example, but be carefulthis can lead to more problems than it's worth (see "Inheriting Properties from a Parent" later in this chapter). In addition, many earlier browsers, including Microsoft Internet Explorer 5.5, balk at some properties being added to the <body> tag, especially the positioning properties discussed in Chapter 7. So as not to confuse the browser, it is best to use double quotation marks ("…") around the declaration list, and single quotation marks ('...') around any values in the declaration list, such as font names with spaces. Make sure that if you are copying and pasting code from an application such as Microsoft Word into a Web editing application such as Adobe Dreamweaver that you convert all smart quotes ("…") to straight quotes ("…"). One common mistake is to confuse the equal sign (=) with the colon (:). Remember that although the style attribute in the tag uses an equal sign, CSS declarations always use a colon. You can also apply common styles to an entire Web page (see the following section) or to multiple Web pages (see "Adding Styles to a Web Site" later in this chapter). Font names made up of more than two words are placed in single quotes ('Font Name') when used with a style.
|
xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>CSS, DHTML & Ajax | Adding CSS to an HTML Tag</title> </head> <body style="font-size: 1em; font-family: Georgia, 'Times New Roman', Times, serif; color: 