font-size em值如何工作?

时间:2014-09-11 14:10:42

标签: css

我正在使用em字体大小,除了边栏之外,它适用于任何地方。

在主要内容中,em大小很棒。如果我将此em尺寸复制到侧边栏,则文本会变大。

我使用的是html /体型大小为17px。然后1.412em来获得我想要的尺寸。要查看侧边栏字体的实时链接,请转到此link。如果您查看右侧边栏上的Twitter Feed,您会看到它使用相同的em,但您可以查看它更大。

2 个答案:

答案 0 :(得分:3)

使用em作为测量值只是不会出现,但会相应增加。

以下是一个例子:

<div>
  <p>
    <span>foo bar</span>
  </p>
</div>

body{
  font-size: 1em;
}
div{
  font-size: 1.5em;/*1.5em of 1em == 1.5em*/
}
div > p{
  font-size: 1.5em;/*1.5em of 1.5em inherited from div == 2.25em*/
}
div > p > span{
  font-size: 1.5em; /*1.5em of 2.25em inherited from p == 3.375em*/
}

所以,我建议你使用px作为测量值。


  

使用ems仅制作可缩放样式表。


如果您想了解有关pxem%的更多信息,请按照此link和此link

进行操作

答案 1 :(得分:1)

不要将em用于font-size,这只是从不使用它的唯一地方。

1em是当前标准字体中m的大小。您可以使用它来设置填充/边距,例如在段落之间或文本块周围,需要根据字体大小进行缩放,以满足在OS /浏览器级别使用自定义设置的人,或者只是作为一种简单的方法来保持&#39;好&#39;距离,而不必担心精确的像素。

将字体缩放到与当前标准字体的m相对的大小毫无意义,unless you want to achieve this effect。如果您愿意,为单个元素或块指定font-size:110%更合乎逻辑。通常,使用ptpx指定字体大小。