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. Spring Boot跨域解决方案

    一.什么是跨域 为保证浏览器的安全,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源,这称之为同源策略,如果一个请求地址里的协议.域名.端口号都相同,就属于同源.依据浏览器同源策略,非同源脚 ...

  2. 安装完oracle11g_2x64位数据库后使用PL Developer链接oracle报错“请确认是否安装了32位oracle和TNS错误”解决方案

    解决使用PL Developer登录oracle报错没有配置TNS错误.首先安装好oracle11g数据库,安装PL developer32位 1,下载“instantclient-basic-win ...

  3. charles 开始/暂停模拟慢网速

    本文参考:charles 开始/暂停模拟慢网速 1.2. stop/start throttling 和 2.2 throttling settings 暂时开始慢网速,这个说实话,我自己是不常用的, ...

  4. STM32的RTC中断标志只能手动清除

    背景: 最近在做一个stm32的项目,其中用到RTC的实时时钟功能.时钟源采用外部32.768K晶振,时钟预分频设置为32767,目的是为了产生1秒的中断,然后在中断处理函数中更新实时年月日时分秒. ...

  5. python中os模块再回顾

    先看下我的文件目录结构 F:\PYTHON项目\ATM购物车\7月28 在此目录下的文件如下: 封装.py 模块os.sys复习.py 运行当前的文件是模块os.sys复习.py 1.获取当前文件所在 ...

  6. FEDay会后-Serverless与云开发，可能是前端的下一站

    进化本身是生物体与环境之间持续不断的信息交换的具体表现. -- 摘自<信息简史> 很荣幸在9月21号成都举办的第五届FEDay上作为讲师为大家分享腾讯云在近两年推出的云开发相关的技术和知识 ...

  7. Dart函数、类和运算符-处理信息

    编程语言虽然千差万别,但归根结底,它们的设计思想无非就是回答两个问题: 1.如何表示信息: 2.如何处理信息: 函数 函数是一段用来独立地完成某个功能的代码.函数是对象类型,它的类型叫做Functio ...

  8. java+selenium-3.9.1多线程 打开连接截取屏幕截图

    废话不多说上代码:(我是用的chrome举得例子哈) 第一步,需要chromedriver.exe 目的和调起chrome 浏览器打开连接,chromedriver.exe的版本与你的chrome版本 ...

  9. 使用Shell脚本编译运行C++源码 输入输出重定向

    在写C++控制台程序的时,如果使用Xcode或者Visual Studio之类的IDE,需要创建许多工程,会造成很多不便.有时,采用Vim或者Sublime text等编辑器编写简单的控制台程序能节省 ...

  10. Jmeter BeanShell 执行多次问题，每发送一次请求执行一次BeanShell问题

    前言:(此问题耗时半天) 提供解决思路的博主又有新问题了. 如图所示,写了一个BeanShell从文件中去获取值之后给测试计划的变量赋值. 问题来了,当禁用b的情况下,a只执行一次.当启用b请求的情况 ...