CSS的相对值和绝对值



css的百分比的值是相对值,比如:50%,这个50%都是基于他的父类元素对应的值。

作为长度单位的px 和em ,px是绝对长度,em是相对长度。

我们常常用em来设置字体大小和元素的宽度,也许使用rem更好点,因为它是基于一个唯一的root的值来设置,而em是基于父类。

Absolute length units
The following are all absolute length units — they are not relative to anything else, and are generally considered to always be the same size.

Unit | Name | Equivalent to
cm | Centimeters | 1cm = 38px = 25/64in
mm | Millimeters | 1mm = 1/10th of 1cm
Q | Quarter-millimeters | 1Q = 1/40th of 1cm
in | Inches | 1in = 2.54cm = 96px
pc | Picas | 1pc = 1/6th of 1in
pt | Points | 1pt = 1/72th of 1in
px | Pixels | 1px = 1/96th of 1in

Relative length units
Relative length units are relative to something else, perhaps the size of the parent element's font, or the size of the viewport. The benefit of using relative units is that with some careful planning you can make it so the size of text or other element scales relative to everything else on the page. Some of the most useful units for web development are listed in the table below.

Unit | Relative to
em | Font size of the parent, in the case of typographical properties like font-size, and font size of the element itself, in the case of other properties like width.
ex | x-height of the element's font.
ch | The advance measure (width) of the glyph "0" of the element's font.
rem | Font size of the root element.
lh | Line height of the element.
vw | 1% of the viewport's width.
vh | 1% of the viewport's height.
vmin | 1% of the viewport's smaller dimension.
vmax | 1% of the viewport's larger dimension.
阅读量: 519
发布于:
修改于: