Colors and units of CSS common properties

In CSS coding, it is necessary to estimate colors and units, however, there are many ways to write about color and unit values in CSS, so it is important to make it clear.

Color

When I was in front of the beginner, there was a question "How do I set the page color?" , commonly used English color names or hexadecimal color values to set the color, but there are some other more complex CSS
Writing.

RGB color

Computers produce new colors through different levels of red, green, and blue, which is often said to be RGB colors. With such a mechanism to produce color, you can determine the color by directly giving different color levels, you can go to
Combines the values of three colors.

Writing:
H1{color:rgb (100%,100%,100%)} percent RGB color notation, numbers ranging from 0% to 100%
H1{color:rgb (0,255,255)} digital RGB color notation, numbers ranging from 0 to 255

Note: The values of both types are trimmed, and the percentages are trimmed to 0%-100%, that is, 100% is trimmed to 100%, less than 0% trimmed to 0%, the number is trimmed to 0-255, and the two cannot be mixed, and the mix will not take effect.

Hex color and color name set color We won't mention it anymore.

Unit

Length units: generally divided into absolute units and relative units. Absolute units from the date of birth of its practical very little, at least I usually rarely used in the project. So here we skip the introduction of absolute units.

Relative units: There are three units of relative length, EM, ex and PX. The first two represent the height of the "element's font height" and "the letter Shezhi ' x '," they are a measure of ordinary printing, and the last px represents "pixels", so it is
Relative, because it relies on the resolution of the Monitor.

In Em:css, an "em" is the font-size value of a given font. The only exception is to set the font size, in which case the value of EM is relative to the parent element.

Such as

• body{font-size:20px;}

• P{font-size:1em;}

At this point the font size of P is 20px, not the default 16px.

PX: set by pixel value px. Such as
body{font-size:20px;}
p{font-size:16px;}
The size of the font in the P element is 16px

Percent value: The percentage is simple compared to the unit of length, which is a percentage value. For example:
h1{line-height:150%;} sets the row height of all H1 to be taller than the normal line.

In summary, percentages are always calculated from a different value, which is mentioned in the following property explanation. And the percentages can be positive, and for some properties, only positive values are accepted, which is said separately.

Today's content is so much, write a little messy, I hope that the more write better.

For more information about the colors and units of CSS Common Properties please follow topic.alibabacloud.com!

