What is the unit of CSS %?

CSS % refers to percentage, which refers to a relative length unit, and the value is relative to the height, width or font size of the containing block; if an element has a percentage attribute set, the descendant elements will inherit it. is the calculated value.

The operating environment of this tutorial: Windows 7 system, css3 version, Dell G3 computer.

Related recommendations: "css video tutorial"

CSS %--Percent

Percent is a relative length unit, The value is relative to the height, width, or font size of the containing block.

The concept of containing block cannot simply be understood as the parent element.

If it is static positioning and relative positioning, the containing block is generally its parent element.

If it is an absolutely positioned element, the containing block should be the nearest ancestor element whose position is a non-static attribute.

If it is a fixed-positioned element, its containing block is the viewport.

For details, please refer to W3Help.

Inheritance of percentage

If an element sets the percentage attribute, the descendant elements inherit the calculated value. For example:

p { font-size: 10px;line-height: 120%; }

Then the value inherited by the sub-element of p is line-height: 12px, not line-height: 120%.

The above is the detailed content of What is the unit of CSS %?. For more information, please follow other related articles on the PHP Chinese website!