CSS 单位
em
and rem:
are often used to create scalable layouts, which maintain the vertical rhythm of the page even when the user changes the font size.
cap:Represents the "cap height" (nominal height of capital letters) of the element’s font
.
ch:
Represents the width, or more precisely the advance measure, of the glyph "0" (zero, the Unicode character U+0030) in the element's font
。
em:Represents the calculated font-size
of the element. If used on the font-size
property itself, it represents the inherited font-size of the element.
ex:Represents the x-height of the element's font
. On fonts with the "x" letter, this is generally the height of lowercase letters in the font; 1ex ≈ 0.5em
in many fonts.
ic:Equal to the used advance measure of the "水" (CJK water ideograph, U+6C34) glyph found in the font used to render it.lh
Equal to the computed value of the line-height
property of the element on which it is used, converted to an absolute length.
rem:Represents the font-size
of the root element (typically <html>
). When used within the root element font-size
, it represents its initial value (a common browser default is 16px
, but user-defined preferences may modify this).
rlh:Equal to the computed value of the line-height
property on the root element (typically <html>
), converted to an absolute length. When used on the font-size
or line-height
properties of the root element, it refers to the properties' initial value.
vh:
Equal to 1% of the height of the viewport's initial containing block.
vw:Equal to 1% of the width of the viewport's initial containing block.
vi:Equal to 1% of the size of the initial containing block, in the direction of the root element’s inline axis.
vb:Equal to 1% of the size of the initial containing block, in the direction of the root element’s block axis.
vmin:Equal to the smaller of vw
and vh
.
vmax:Equal to the larger of vw
and vh
.
px:One pixel. For screen displays, it traditionally represents one device pixel (dot). However, for printers and high-resolution screens, one CSS pixel implies multiple device pixels. 1px
= 1/96th of 1in
.
cm:One centimeter. 1cm
= 96px/2.54
.
mm:One millimeter. 1mm
= 1/10th of 1cm
.
Q:One quarter of a millimeter. 1Q
= 1/40th of 1cm
.
in:One inch. 1in
= 2.54cm
= 96px
.
pc:One pica. 1pc
= 12pt
= 1/6th of 1in
.
pt:One point. 1pt
= 1/72nd of 1in
.