css中关于单位的一些问题
Css中关于单位的一些问题
相对字体长度:
- Em:Em 是一个相对单位。起初排版度量时是基于当前字体大写字母”M”的尺寸的。当改变font-family时,它的尺寸不会发生改变,但在改变font-size的大小时,它的尺寸就会发生变化。 在没有任何CSS规则的前提下,1em的长度是: 1em=16px=0.17in=12pt=1pc=4.2mm=0.42cm
Em单位有点古怪,当设置了font-size属性后,它会逐级向上相乘,所以如果一个设置了font-size:1.1em的元素在另一个设置了font-size:1.1em的元素里,而这个元素又在另一个设置了font-size:1.1em的元素里,那么最后计算的结果是1.1X1.1X1.1=1.331rem(根em)。这意味着即使一个元素设置为10em,这个元素也不会在他出现的每个地方都是10em。如果font-size变化了,它可能会宽点,也可能会窄点。
- Rem: Rem和em一样也是一个相对单位,但是和em不同的是rem总是相对于根元素(如:root{}),而不像em一样使用级联的方式来计算尺寸。
- Point: Point是一个物理度量单位,1pt=1/72 in.在CSS之外point是最常用的尺寸类型(可能这就是css支持point的原因)。它在语言里也很常见“当然他们把这个重要的信息设置成了小八号字体”。在打印样式表和物理媒介中,point是最有意义的,当然你也可以用在屏幕媒介上使用,或者其他的地方
- Pica: Pica和points一样,只不过1pc=12pt。
- Ex: ex是一个基于当前字体的x字母高度度量的。ex度量时有时候根据字体自身的信息,有时候由浏览器指明是通过一个小写字形来度量,最糟糕的情况是,它被设置成0.5em。它之所以被命名为“x”的高度,是因为是基于x字母的高度的。要理解x-height,想象一个小写字母,比如“d”,它会有一部分翘起,x-height是不包括翘起的这一部分的,它的高度是那个字母最下面的那一部分。和em不同,当改变font-family时em不会改变,而ex单位会变化,因为一个单位的值和那个字体是特殊的约束关系。
- Ch: ch的内涵和x高度相似,只是ch是基于字符0的宽度的而不是基于字符x高度的。当font-family改变的时候ch也会随着改变。
可视区百分比长度单位:
- Vw: vw是可视区宽度单位。1vw等于可视区宽度的百分之一。vw单位跟百分比很相似,不同的是vw的值对所有的元素都一样,与他们父元素或父元素的宽度无关。有点像rem单位那样总是相对于根元素。
- Vh:vh和vw(viewport widht)单位一样,不同的是vh是相对于可视区的高度。
- Vmin:vmin的值是当前vw和vh中较小的值。在标准尺寸类型的使用实例中,和由自己确定屏幕大小的vw、vh单位相比,vmin是一个更有用的度量标准。
- Vmax:Vmax的值是vw和vh中的较大的值
离奇的长度单位:
百分比:
以百分比为单位的长度值是基于具有相同属性的父元素的长度值。例如,如果一个元素呈现的宽度是450px,子元素的宽度设为50%,那么子元素呈现的宽度为225px。
- Px:像素或许被认为是最好的“设备像素”,而这种像素长度和你在显示器上看到的文字屏幕像素无关。px实际上是一个按角度度量的单位。在web上,像素仍然是典型的度量单位,很多其他长度单位直接映射成像素,最终,他们被按照像素处理,javascript语言里的单位就是使用的像素。
- In: 英寸是一个物理度量单位,但是在CSS领域,英寸只不过被直接映射成像素罢了。
- Cm: 厘米。
- Mm: 毫米。
css中关于单位的一些问题的更多相关文章
- 一起来看看css中的单位
一起来看看css中的单位 由于一直以来对于css中的百分比单位究竟是相对于谁的比例,这个问题不是很了解,所以就专门找资料看了一下. <div class="container w500 ...
- CSS中的单位px、em、rem、%、vw、vh、vm
px 相对长度单位,像素px 是相对于显示器屏幕分辨率而言的.是我们网页设计常用的单位,也是基本单位. 通过 px 可以设置固定的布局或者元素大小,缺点是没有弹性.用 px 设置字体大小时,比较稳定和 ...
- 关于CSS中的单位px、em、rem
首先,px.em.rem都是相对单位: px(pixel像素)是相对于显示器屏幕分辨率的,IE无法调整那些使用px作为单位的字体大小: em是相对于当前对象内文本字体的尺寸,如当前对行内文本的字体尺寸 ...
- css中的单位和css中的颜色表示方法
css中颜色的表示方式: 图片来源http://www.w3school.com.cn
- ----关于css中常见单位----
1.px 像素,绝对单位长度,可设定固定的长度大小.(像素是相对于显示器屏幕分辨率而言) 所有浏览器都显示为一样大小. eg: html: <p>这是一段正常段落</p> &l ...
- css中字体单位px,pt,em,百分比之间的区别和用法
px 即像素,一般国内网站使用较多,默认大小是16px; pt 印刷行业常用单位 em 相对单位,相对父元素属性的单位 ,一般用于移动端布局 rem 结合相对定位和绝对定位的优势,相对根元素htm ...
- CSS中的那点事儿(一)--- CSS中的单位1
单位主要用在规定元素的数值性css属性的,这里主要讨论应用的比较多的是width height padding margin font-size,而单位中应用最广泛就是%.px.em 百分比 百分比 ...
- 深度解析CSS中的单位以及区别
css中有几个不同的单位表示长度,使用时数字加单位.如果长度为0,则可以省略单位. 长度单位可分为两种类型:相对和绝对. 绝对长度 绝对长度单位是一个固定的值,反应真实的物理尺寸,不依赖于显示器.分辨 ...
- css中的单位
一.相对长度单位: 相对长度是根据与其他事物的关系来度量的.共有3种相对长度单位:em,ex,px. 1个“em”定义为一种给定字体的font-size的值,例如,一个元素的font-size为14像 ...
随机推荐
- springboot缓存注解——@CacheEvict
@CacheEvict:缓存清除 可以通过key指定清除的数据 如果不写默认参数的值 allEntries = true (是否删除该缓存名中所有数据,默认为false) beforeInvocati ...
- [名词解释 ] transparent
1.材质,效果透明. 2.思想透明,容易获取(思维简单,单纯) 3.后台静默(of a process or interface) functioning without the user being ...
- Day 4 变量常量
编辑语言的分类 编程语言,他是人与计算机沟通的一种介质 机器语言 计算机只认识0和1,为了和计算机沟通,你也得认识0和1 优点:执行效率快 缺点:普通人根本就写不了这种代码,开发效率低 汇编语言 他还 ...
- [CQOI2014]数三角形
[CQOI2014]数三角形 给定\(n\times m\)的网格,求三个点在其格点上的三角形个数,1<=m,n<=1000. 解 法一:直接 显然为组合计数问题,关键在于划分问题,注意到 ...
- element ui的 el-dropdown-item标签点击事件
在vue项目中使用element的el-dropdown-item标签时 给标签添加click事件 初始时按照正常写法 <el-dropdown-item @click="click( ...
- LeetCode--036--有效的数独(java)
判断一个 9x9 的数独是否有效.只需要根据以下规则,验证已经填入的数字是否有效即可. 数字 1-9 在每一行只能出现一次. 数字 1-9 在每一列只能出现一次. 数字 1-9 在每一个以粗实线分隔的 ...
- jacoco覆盖率工具测试及性能分析
ant版本:https://ant.apache.org/bindownload.cgi jdk版本 注: ant 1.10 ---> jdk1.8 ant 1.9 ---& ...
- json处理+list.sort()排序
#coding:utf-8 """ json是一种轻量级数据交换格式,可以对复杂数据进行表达和存储 规格: 1.数据保存在键值对里 2.键值对之间由逗号分隔 3.花括号用 ...
- zzw原创_linux下的ping6用法
[oracle@sv0379 ~]$ /sbin/ifconfig -aeth0 Link encap:Ethernet HWaddr 00:E0:81:BC:4B:08 ...
- 服务器安装SSH服务:
强制关闭yum进程: rm -f /var/run/yum.pid 启动SSH: service sshd start 设置开机运行: chkconfig sshd on