CSS has 1677216 colors for your disposal. It can be represented by the name, rgb (red, green, and blue) value, or hex value.
Red
Same
Rgb (255, 0, 0)
Same
Rgb (100%, 0%, 0%)
Same
# Ff0000
Same
# F00
There are 16 valid predefined color names. They are: aqua (water green), black (black), blue (blue), fuchsia (purple red), gray (gray), green (green), lime (light green), maroon, navy, olive, purple, red, silver, teal, white) and yellow (yellow ).
Transparent is also a valid value.
In the three values from 0 to 255 of rgb, 0 is the lowest order (for example, no red), and 255 is the highest order (for example, all red ). These values can also be percentages.
The Hexadecimal ("Sexadecimal" is more knowledgeable and more correct) is a 16-bit system. In our daily life, we often use a decimal system (based on 10, from 0 to 9), but the hexadecimal system has 16 numbers, from 0 to f.
In CSS, the hexadecimal format is defined by the half-width English #, followed by 3 or 6 digits. Basically, the three digits are 6-bit compressed versions (# f00 is # ff0000, # c96 is # cc9966, etc ). The three-digit version is easy to explain (the first digit, like the first value of rgb, is red and the second green, needless to say, the third is blue ), however, the six-digit version gives you more precise control over colors.
Foreground color and background color
Color can be applied using color and background-color (note that this must be in American English rather than color.
The following shows a piece of CSS with blue background and yellow foreground text:
The code is as follows: |
Copy code |
H1 { Color: yellow; Background-color: blue; }
|
These colors are a bit rough, so you can further improve the CSS code to make the text look fresh:
The code is as follows: |
Copy code |
Body { Font-size: 0.8em; Color: navy; } H1 { Color: # ffc; Background-color: #009; }
|
Save the CSS document and refresh the browser. You can see that the first level title (h1 element) has become a mix of colors between yellow and blue.
You can apply the attributes of color and background-color to most HTML elements, including the body, which can change the color of everything on the page.