单位"/>
CSS中的em单位
CSS中有众多单位,常用的px是绝对单位,em则是相对单位。在响应式和移动端的大前提下,使用em能够更方便快捷的一次性调整web文档极其HTML元素的字体大小、宽度、边距、边框等一系列属性,可以说在某些方面,使用em作为单位比px更灵活。
一、什么是em
1.em的长度
em是CSS中的一个相对单位,它的单位长度是根据元素的文本垂直长度来决定的。可以作用在width、height、line-height、margin、padding、border等样式的设置上。
1em=元素中文本的1个垂直高度
根据上面的规则:如果元素中文本的大小为16px,那么1em=16px;如果元素中文本大小为20px,那么1em=20px……
2.em与HTML文本大小默认值
浏览器中的文本一般默认为16px,也就是说,默认的情况下:
1em=16px
那如何改变这个设定呢?只要显式的设置body元素的font-size即可。eg:
body {font-size: 24px;width: 10em; /* 10em = 24px * 10 = 240px */
}
3.em与继承
在CSS中,如果一个元素没有设置font-size,那么它的font-size值就是它父元素的font-size值,这很好理解,就是简单的继承而已。eg:
<style>body {font-size: 12px;}div {
更多推荐
CSS中的em单位
发布评论