Style Sheets: Colors
A color is a either a keyword or a numerical RGB specification.
The suggested list of keyword color names is:
aqua, black, blue, fuchsia, gray, green, lime,
maroon, navy, olive, purple, red, silver, teal, white, and yellow.
These 16 colors are taken from the Windows VGA palette.
BODY {color: black; background: white }
H1 { color: maroon }
H2 { color: olive }
The RGB color model is used in numerical color specifications.
These examples all specify the same color:
EM { color: red } /* natural language */
EM { color: #f00 } /* #rgb */
EM { color: #ff0000 } /* #rrggbb */
EM { color: rgb(255,0,0) } /* integer range 0 - 255 */
EM { color: rgb(100%, 0%, 0%) } /* float range 0.0% - 100.0% */
This property describes the foreground color of an element's text
content.
It allows authors to specify the color of an element.
<HEAD>
<TITLE>CSS Example</TITLE>
<STYLE>
H1 { font-size: xx-large; color: green }
H2 { font-size: x-large; color: red }
H3 { font-size: large; color: blue }
</STYLE>
</HEAD>
This style sheet instructs the browser to show level-one headings in
an extra-extra-large, green font,
and to show level-two headings in an extra-large, red font.
It's advisable to specify background and foreground color properties
together, to prevent conflicts with user style sheets.
Authors may specify the background of an element
(i.e., its rendering surface) as either a color or an image.
Background properties do not inherit, but the parent element's
background will shine through by default because of the initial
'transparent' value on
background-color.
H1 { background-color: #F00 }
It's advisable to specify background-image whenever
background-color is used,
to prevent conflicts with user style sheets.
In most cases, background-image: none is suitable.
Authors may also use the shorthand
background property,
which is currently better supported than the background-color property.
More about
Color
|
