CSS tutorial color

Source: Internet
Author: User
Tags valid

CSS has 1677216 colors for your disposal. It can be represented by the name, rgb (red, green, and blue) value, or hex value.
Rgb (255, 0, 0)
Rgb (100%, 0%, 0%)
# Ff0000
# 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.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.