Customizing HTML Tags With CSS Rules - The HTML Selector

One of the reasons CSS is so popular is the versatility it gives to HTML tags. Although you cannot "turn off" the tag's built-in controls, you can add more controls to the HTML tags to extend their usefulness. You do this by adding new CSS definitions to the tag selector. Let's use the HTML <p> tag for our example and we will add a background color, a font face, font size and a text color control to the <p> tag. This will cause everything between any opening and closing <p> tags to be controlled by our new definitions throughout the web page.

p {
background-color: #000000;
font-family: arial;
font-size: 12px;
color: #ffffff;
}

In our example, the CSS rule begins with the HTML selector (p) which is followed by the CSS declaration block containing all the property-value definitions we wish to add. As usual, each definition begins with the property, followed by a colon, the value and ending with a semicolon. The entire block is placed within curly brackets. There are a few things to remember when writing your own CSS rules for HTML tags.

You can place your customized CSS rule inside the <style></style> tags in the head section of your web page.
You can place your customized CSS rule inside an external CSS file.
The customized CSS definitions you add to a particular tag selector must contain properties that can be control by that tag.
Because you place the customized rule in the head section or external CSS file, it will affect the entire web page. If you only need to control one individual HTML tag (one special instance of a tag), you would apply an inline style to that individual tag.
The tag keeps the built-in properties of that HTML tag. For example, the HTML <b> bold tag will continue to apply the bold affect to any text placed between opening and closing <b></b> tags.

	Editor Wanted BellaOnline's HTML Editor