- 1em等于当前的字体尺寸。2em 等于当前字体尺寸的两倍。例如,如果某元素以 12pt 显示,那么 2em 是24pt。在 CSS 中,em 是非常有用的单位,因为它可以自动适应用户所使用的字体。
- em是一个相对的单位,是当前元素相对于父元素字体的大小而言的;例如:父元素设置font-size: 32px ,子元素设置font-size: 1em ,那么子元素的字体大小也是32px
示例:
<nav class="ui inverted attached segment m-padded-tb-mini" >
<div class="ui container">
<div class="ui inverted secondary menu">
<h2 class="ui teal header item">Blog</h2>
<a href="#" class="item">首页</a>
<a href="#" class="item">分类</a>
<a href="#" class="item">标签</a>
<a href="#" class="item">关于我</a>
</div>
</div>
</nav>
css文件:
.m-padded-tb-mini {
padding-top: 0.2em !important;
padding-bottom: 0.2em !important;
}
应用后效果:
可以看出,子元素的大小和父元素变得相对一致,看上去更加紧贴在一起了。
参考:w3cschool