首页 > 编程笔记 > CSS笔记 阅读数:883

CSS em:字体高度

em 是 CSS 中的一个相对单位,用来设置 HTML 元素相对字体的高度,它能够根据字体的 font-size 属性值来确定具体的大小。1em 等于一个 font-size 的大小。

【示例1】在下面样式中定义段落文本行高为字体大小的 2 倍。
p{  /*设置段落文本属性*/
    font-size: 12px;
    line-height: 2em;  /* 行高为24px */
}
从上面样式代码中可以看出:一个 em 等于 font-size 的属性值,如果设置font-size: 12pt,则line-height: 2em就会等于 24pt。

如果设置 font-size 属性的单位为 em,则 em 的值将根据父元素的 font-size 属性值来确定。

例如有下面的 HTML 结构:
<div id="main">
    <p>em 相对长度单位使用</p>
</div>
为它设置如下的 CSS 样式:
#main { font-size: 12px; }
p { font-size: 2em; }
则 p 元素里面的字体大小将为 24px。

同理,如果父对象的 font-size 属性的单位也为 em,则将依次向上级元素寻找参考的 font-size 属性值,如果都没有定义,则会根据浏览器默认字体进行换算,默认字体一般为 16px。

爱面试的程序媛,一个分享面试经验的公众号。跟着站长一起学习,每天都有进步。

通俗易懂,深入浅出,定时分享程序员面试的那点事。

面试如何造火箭?工作如何拧螺丝?都在这个公号哦。

扫描二维码关注公众号,免费领取价值 1000 元的求职面试资料(限时免费)!

当你决定关注「爱面试的程序媛」,你已然超越了90%的程序员!

爱面试的程序媛二维码
微信扫描二维码关注

所有教程

相关文章