The percentage that often appears in CSS properties

It is important to understand the cardinality of CSS, which often appears as a percentage in the property values. I have specifically looked at the CSS2.1 standard of the popularity of the, in this collation:

Percent units

Multiply the width of the containing block margin, padding, left, right, text-indent, width, max-width, min-width

Multiply the height of the containing block top, bottom, height, max-height, min-height

The concept of a containment block (containing block) cannot be simply understood to be a parent element. In the case of static positioning and relative positioning, the containing block is generally its parent element. However, for an absolutely positioned element, the containing block should be an ancestor of the position, which is closest to it, absolute, relative, or fixed. For a fixed positioned element, its containing block is a viewport (viewport). Refer to W3help for details.

Multiplies the font size of the element line-height

Multiply the line height of the element vertical-align

The percentage background-position in the background positioning sets two values in the horizontal and vertical directions respectively, and if you use percentages, the percent value is applied to both the element and the image. For example, 50% 50% will align the image (50%, 50%) with the box (50%, 50%), which is equivalent to Setting Center center. Similarly 0% 0% is equivalent to the left top,100% 100% equivalent to right bottom.

Percentage values in the font size font-size should be multiplied by the font size that the element inherits from, that is, the font size of the parent element.

Other font units since the font size, by the way 818 other font units, some may not normally use, but it is no harm to understand. There are two relative units:

The em--corresponds to the current font height, called the "Full Body box" (em square). If this unit is used on font-size, it should be multiplied by the parent element's font size. Used on attributes other than font-size, you should multiply the font size of the element itself. ex--corresponds to the height of the "x" in the font. The following are absolute units:

in--inches (inch), equivalent to 2.54cm. cm--cm (centimeter). mm--mm (millimeter). pt--pound (point). 1PT is equivalent to 1/72 of 1in. pc--Pickup (PICA). 1pc = 12pt. px--pixels (pixel unit). 1px = 0.75pt.

Inheritance of percentages:

If an element has a percentage attribute set, the descendant element inherits the computed value. For example:

p {font-size:10px} p {line-height:120%}/ 120% of ' font-size ' /Then the child element of P inherits to a value of line-height:12px, not line-he ight:120%.

The percentage that often appears in CSS properties (RPM)