为什么基金会使用margin-left:1.25rem表示<ul>

时间:2017-04-14 22:15:49

标签: css html5 css3 zurb-foundation

sf::SocketSelector::wait()

基金会使用%表示margin-left和margin-right。

然而,在无序列表中,他们使用rem作为margin-left。

我无法理解这背后的逻辑。

2 个答案:

答案 0 :(得分:3)

Rems类似于%和em,因为它们基于基本字体大小(默认为16px)。与%和em不同,rem单元不会继承父元素的字体大小。使用%和em,当您嵌套元素时,您会看到字体大小越来越小。 rem单位不会发生这种情况。相反,无论元素在DOM层次结构中的哪个位置,rem大小的元素总是引用基本字体大小。

使用rem作为文本元素周围的边距和填充,可在布局中提供可伸缩性。填充:10rem; @ 16px基本字体大小产生160px的填充。更改基本字体大小不仅可以向上或向下缩放字体大小,还可以按比例更改使用rem单位的周围元素。基金会还使用rem进行媒体查询。我们的想法是,如果增加基本字体大小,不仅字体大小会变大,容器会增长,更快地会触发断点。

答案 1 :(得分:0)

百分比主要用于网格,因为这些比例完美;列表的左边距生成列表的缩进,这是与文本相关的设计节奏,因此使用基本字体大小(rem)是非常合乎逻辑的(对我而言)。