CSS - px、em、%
px(像素)、em、% 百分比
1. em
1.1 本元素给定字体的 font-size 值,如果元素的 font-size 为 14px ,那么 1em = 14px;如果 font-size 为 18px,那么 1em = 18px。
实现段落首行缩进 24px(也就是两个字体大小的距离)
p{font-size:12px;text-indent:2em;}
1.2 但当给 font-size 设置单位为 em 时,此时计算的标准以 p 的父元素的 font-size 为基础
html:
<p>以这个<span>例子</span>为例。</p>
CSS:
p{font-size:14px}
span{font-size:0.8em;}
结果 span 中的字体“例子”字体大小就为 11.2px(14 * 0.8 = 11.2px)。
2. 百分比%
设置行高(行间距)为字体的130%(12 * 1.3 = 15.6px)。
p{font-size:12px;line-height:130%}
CSS - px、em、%的更多相关文章
- css中的px、em、rem 详解
概念介绍: 1.px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度,需要指定精度DPI(Dots Per Inch,每英寸像素数),在扫描打印时 ...
- html,CSS文字大小单位px、em、pt的关系换算
html,CSS文字大小单位px.em.pt的关系换算 这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与 ...
- 你应该知道的CSS文字大小单位PX、EM、PT[转]
摘要: 这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章, 题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与em之间的关系和特点,看过以后确实收获很大.平 ...
- 你应该知道的CSS文字大小单位PX、EM、PT
这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章, 题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与em之间的关系和特点,看过以后确实收获很大.平时都是用 ...
- CSS文字大小单位PX、EM、PT
老是被人问到px.pt和em的区别,自己有时候也会纠结到底该用什么单位,今天特意查了一些文章,下面这篇虽然很久远了,但解释的比较全面,转载收藏之.点击查看原文 这里引用的是Jorux的"95 ...
- 说说css中pt、px、em、rem都扮演了什么角色
前段时间,终于仔仔细细的把pt.px.em.rem了解了一遍,简单整理了一下做个记录. pt.px.em.rem都是什么 pt单位名称为点(Point),绝对长度单位.现在网页中出现得很少甚至不出现, ...
- CSS中的单位px、em、rem、%、vw、vh、vm
px 相对长度单位,像素px 是相对于显示器屏幕分辨率而言的.是我们网页设计常用的单位,也是基本单位. 通过 px 可以设置固定的布局或者元素大小,缺点是没有弹性.用 px 设置字体大小时,比较稳定和 ...
- CSS文字大小单位px、em、pt详解
这里引用的是Jorux的“95%的中国网站需要重写CSS”的文章,题目有点吓人,但是确实是现在国内网页制作方面的一些缺陷.我一直也搞不清楚px与em之间的关系和特点,看过以后确实收获很大.平时都是用p ...
- 详解CSS中的几种长度px、em、pt
说说css的几种距离吧,大致有px.em.pt.pc.in.mm.cm.ex八种,其中最常见到的是px,我还见到过的有ex和mm.cm,当然后两个在当年见的更多. 其实px,我们最熟悉,而在电脑上也应 ...
- CSS各种度量单位----px、em、%、rem、vh/vw、vmin/vmax
本文主要讲下CSS中各类度量单位的意思和区别. 开发中最常用到的css单位是px.em.%.随着css3的出现,带来了更多的度量单位,这些单位为响应式开发,带来很大的好处.各种单位的浏览器兼容性可以去 ...
随机推荐
- Python 分发包中添加额外文件【新手必学】
在制作一个 Python 分发包时经常需要把一些文件添加到包中.最常见的例子是你希望通过 pip install命令安装 Python 包时会在 /etc/ 等目录下自动添加默认配置文件,由此可以 ...
- 2019-08-05 纪中NOIP模拟B组
T1 [JZOJ1432] 输油管道 题目描述 请你帮忙设计一个从城市M到城市Z的输油管道,现在已经把整个区域划分为R行C列,每个单元格可能是空的也可能是以下7种基本管道之一: 油从城市M流向Z,‘+ ...
- yii2模型
多对多可以使用all()来调用 对数据提供者进行修改 /** * Lists all ArticleCate models. * @return mixed */ public function ac ...
- win 下 docker 环境配置
声明 此文只针对 win7.win10 家庭版等用户操作系统,因为这些系统无法使用 windows 的 Hyper-V 虚拟技术.只能借助于 Virtual Box 虚拟机来使用 docker. Do ...
- redis5.0.7安装及配置集群
1.安装环境linux系统,时间2020年2月 2.官网下载https://redis.io/ 3.解压 tar -zxvf redis-5.0.7.tar.gz 4.配置文件 //创建etc文件夹, ...
- 配置SSH使用密钥认证:实现免输入密码登陆
一.实际工作生产场景分析 张三是某公司员工,由于业务上的需求,需要经常使用SSH工具登陆服务器A的root账户进行操作,为避免重复进行密码验证身份.现采用张山的公钥发送给服务器A,免输入密码登陆到服务 ...
- php对字符串的操作
php最文字的处理很是强大,之前一直云里雾里,这次学习一下. 1,' 与 ”的区别 <?php //双引号中的特殊字符会被解析 echo "你好\t我好";echo &quo ...
- Java学习笔记(九)面向对象---模板方法设计模式
理解 在定义功能时功能的一部分是确定的,但是有一部分是不确定的,而确定的部分在使用不确定的部分,那么就将不确定的部分暴露出去,由该类的子类完成. 举例 需求 获取一段程序的运行时间 代码 abstra ...
- IntelliJ IDEA 2017.3尚硅谷-----修改当前主题字体、字体大小、行间距、控制台、注释
- imread函数+cvtColor()函数
加载图像(用cv::imread) imread功能是加载图像文件成为一个Mat对象,其中第一个参数表示图像文件名称 第二个参数,表示加载的图像是什么类型,支持常见的三个参数值 IMREAD_UNCH ...