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. 【LeetCode】103# 二叉树的锯齿形层次遍历

    题目描述 给定一个二叉树,返回其节点值的锯齿形层次遍历.(即先从左往右,再从右往左进行下一层遍历,以此类推,层与层之间交替进行). 例如: 给定二叉树 [3,9,20,null,null,15,7], ...

  2. 聚焦Python分布式爬虫必学框架Scrapy 打造搜索引擎视频教程

    下载链接:https://www.yinxiangit.com/595.html 目录: 第1章 课程介绍介绍课程目标.通过课程能学习到的内容.和系统开发前需要具备的知识 第2章 windows下搭建 ...

  3. SpringMVC 视图解析器 InternalResourceViewResolver

    我们在使用SpringMVC的时候,想必都知道,为了安全性考虑,我们的JSP文件都会放在WEB-INF下, 但是我们在外部是不可以直接访问/WEB-INF/目录下的资源对吧, 只能通过内部服务器进行转 ...

  4. webpack中clean-webpack-plugin插件使用遇到的问题及解决方法

    webpack 会生成文件,然后将这些文件放置在 /dist 文件夹中,但是 webpack 无法追踪到哪些文件是实际在项目中用到的. 通常,在每次构建前清理 /dist 文件夹,是比较推荐的做法,因 ...

  5. [币严BIZZAN区块链]数字货币交易所钱包对接之比特币（BTC）

    在币严BIZZAN开发数字货币交易所的过程中,一共有两大难点,一个是高速撮合交易引擎,另一个是钱包对接,这两者是我们团队以前没有接触过的.这个系列的文章主要介绍数字货币交易所钱包对接实现技术.第一个要 ...

  6. 分享一个 pycharm 专业版的永久使用方法

    刚开始接触Python,首先要解决的就是Python开发环境的搭建. 目前比较好用的Python开发工具是PyCharm,他有社区办和专业版两个版本,但是社区版支持有限,我们既然想好好学python, ...

  7. 【第十五篇】easyui datagrid的列编辑，同时插入两张表的数据进去

    看图说话. 需求:插入两张表,上面的表单是第一张表的内容,下面的两个表格是第二张详情表的内容,跟第一张表的id关联 第二张表有一个列是需要用户手动填写添加的. 国际惯例,上代码 <div id= ...

  8. java中的GC

    1.GC发生在JVM中的堆区 2.GC是很么? 1.次数上频繁收集Young区  Minor  GC 2.次数上较少收集Old区       Full      GC 3.基本不动的Perm区 3.G ...

  9. Flume介绍与安装

    搭建环境 部署节点操作系统为CentOS,防火墙和SElinux禁用,创建了一个shiyanlou用户并在系统根目录下创建/app目录,用于存放 Hadoop等组件运行包.因为该目录用于安装hadoo ...

  10. springboot logback日志的使用

    以下有两个使用,一个是简单使用,另一个是需要进行详细的配置再使用.首先给出源代码.可以直接使用 import org.slf4j.Logger;import org.slf4j.LoggerFacto ...