em详解

     em可以理解成“倍”。

em会以父级元素中所设置的字体像素值为基准值进行成倍放大；

字体大小=(父级元素中的字体像素 * em的值)

例:

网页部分代码如下：

1.我现在没有在父级元素中设置任何字体像素值，而直接在<h2>标签中设置了字体大小为“3em”。

 

此时将使用浏览器的默认设置（一般为12px）作为基准像素

网页中显示如下

现在我在父级元素<body>中加上控制字体大小的像素值

设置为30px，然后再保存刷新下网页。

可以看到字体明显大了许多。

总结：当没有在父级元素中设置字体的像素值时使用em会以浏览器的默认值作为基数，如果在父元素中设置了字体的像素值，则会以父级元素的像素值作为基数

css中em单位详解，说明的更多相关文章

  1. DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)

    css中cursor属性详解-鼠标移到图片变换鼠标形状   语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...

  2. CSS中background属性详解

    CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-c ...

  3. Weka中EM算法详解

    private void EM_Init (Instances inst) throws Exception { int i, j, k; // 由于EM算法对初始值较敏感,故选择run k mean ...

  4. css中border-radius用法详解

    border-radius:由浮点数字和单位标识符组成的长度值.border-top-left-radius --- 左上border-top-right-radius --- 右上border-bo ...

  5. CSS中的BFC详解

    引言: 这篇文章是我对BFC的理解及总结,带你揭开BFC的面纱.你将会知道BFC是什么,形成BFC的条件,BFC的相关特性,以及他的实际应用. 一.何为BFC BFC(Block Formatting ...

  6. CSS中style用法详解

    转自:http://www.cnblogs.com/xingxingchongchong/p/6501575.html css样式表按其所在位置分三种: 1.内嵌样式表 2.内部样式表 3.外部样式表 ...

  7. css中border-sizing属性详解和应用

    box-sizing用于更改用于计算元素宽度和高度的默认的 CSS 盒子模型.它有content-box.border-box和inherit三种取值.inherit指的是从父元素继承box-sizi ...

  8. CSS中em，px区别（转）

    这里向大家描述一下CSS中px和em的特点和区别,px像素(Pixel),相对长度单位,像素px是相对于显示器屏幕分辨率而言的,而em是相对长度单位,相对于当前对象内文本的字体尺寸,相信本文介绍一定会 ...

  9. css样式继承规则详解

    css样式继承规则详解 一.总结 一句话总结:继承而发生样式冲突时,最近祖先获胜(最近原则). 1.继承中哪些样式不会被继承? 多数边框类属性,比如象Padding(补白),Margin(边界),背景 ...

随机推荐

  1. 搭建自己的技术博客系列（二）把 Hexo 博客部署到 GitHub 上

    1.在GitHub上建一个新仓库

  2. 史上最详 Thymeleaf 使用教程

    前言 操作前建议先参考我的另一篇博客:玩转 SpringBoot 2 快速整合 | Thymeleaf 篇 查看如何在SpringBoot 中使用 Thymeleaf.还有一点需要注意的是:模版页面中 ...

  3. android 中Application的作用

    转自:lieren666 博客地址:http://blog.csdn.net/lieren666/article/details/7598288 What is Application Applica ...

  4. 【学习笔记】第六章 python核心技术与实践--深入浅出字符串

    [第五章]思考题答案,仅供参考: 思考题1:第一种方法更快,原因就是{}不需要去调用相关的函数: 思考题2:用列表作为key在这里是不被允许的,因为列表是一个动态变化的数据结构,字典当中的key要求是 ...

  5. [C++]类的设计（2）——拷贝控制（拷贝控制和资源管理）

      1.类的行为分类:看起来像一个值:看起来想一个指针.     1)类的行为像一个值,意味着他应该有自己的状态.当我们拷贝一个像值的对象时,副本和原对象是完全独立的.改变副本不会对原有对象有任何影响 ...

  6. Mysql高手系列 - 第14篇：详解事务

    这是Mysql系列第14篇. 环境:mysql5.7.25,cmd命令中进行演示. 开发过程中,会经常用到数据库事务,所以本章非常重要. 本篇内容 什么是事务,它有什么用? 事务的几个特性 事务常见操 ...

  7. 使用System.Text.Json处理Json文档以及部分坑

    System.Text.Json处理Json文档需要用到JsonDocument,JsonElement,JsonProperty. JsonDocument就是一个表示Json文档的东西,JsonE ...

  8. web前端开发面试题(附答案)-3

    1.用纯css创建一个三角形的原理: .demo{ width:0; height: 0; border: 5px solid transparent; border-left-color: red; ...

  9. 一个有意思的js块作用域问题

    1.问题 首先把问题放出来,昨天看了一个掘友发的一个问题,然后跟我同事一起研究了一下,没找出来是为什么,然后我回来一直在想为什么,然后各种找资料研究,从各个方面找为什么,比如js上下文,作用域,js垃 ...

  10. Android开发——Kotlin开发APP使用笔记

    之前一直使用java来开发Android项目,学了新的kotlin语言,前来试一试,并说一下kotlin对Android的一些功能增强 创建项目 我使用的是Android Studio3.0+,所以默 ...