CSS for the Newbie - Applying a Style to an Element with an Attribute
(Page 4 of 5 )
If you want to apply your style to elements with certain attributes, you can do so in the following manner:
input[type=”textarea”] {background-color: yellow}
This will give every textarea in your page a background color of yellow.
Using the id Selector
The Id Selector allows you to apply styles to HTML elements that have a specific id value. Here is an example:
#fred {text-family: Verdana; color: orange}
The above code will apply the style to any HTML element with an ID value of “fred,” whether it's a table, a paragraph, a header, etc.
If we wanted to apply the style to a specific element type with an ID value, we would do so like this:
h1#bigguns
{
text-family:Impact;
color: purple
}
This rule would be applied to an H1 tag that had the id of “bigguns.”
Just a reminder regarding the ID of elements: you may not have two elements with the same id value in the same document, and value must begin with a letter from the alphabet. The value is case-sensitive and may contain letters, numbers, hyphens, underscores, colons, and periods.
Leaving a Comment
Everyone likes to put their two cents in, and even nerdy programmers are no exception. In fact, they probably comment more than anyone else. Leaving comments in your code is a good way to tell future programmers, who may have to work on your code, what exactly it was you were trying to accomplish. It is also a useful reminder for yourself when you look back upon it months later and wonder what the heck you were doing.
In CSS you leave comments like so:
/* Look at me I am a comment! The browser does not see me tee-hee! */
Next: Doing It In Style >>
More Style Sheets Articles
More By James Payne