css之单位

角度<angle>

用于<gradient>s和某些transform功能中

deg表示以度为单位的角度。一整圈就是360deg

例如:0deg90deg14.23deg

grad用渐变表示角度。一整圈就是400grad

例如:0grad100grad38.8gradrad表示以弧度表示的角度。

一个完整的圆是2π弧度,近似于6.2832rad1rad是180 /π度。

例如:0rad1.0708rad6.2832radturn表示一个转数的角度。

一整圈就是1turn。例如:0turn0.25turn1.2turn

频率<frequency>

表示频率维度,诸如说话声音的音高。它目前不在任何CSS属性中使用。

Hz表示以赫兹为单位的频率。

例如:0Hz1500Hz10000Hz

kHz表示以千赫为单位的频率。

例如:0kHz1.5kHz10kHz

长度<lenghth>

表示的距离值。长度可以以多种CSS属性

字体相对长度单位

cap表示元素的“上限高度”(大写字母的名义高度)font

ch表示元素中字形“0”(零,Unicode字符U + 0030)的宽度,或者更准确地说是提前度量font

em表示font-size元素的计算结果。如果在font-size属性本身上使用它,它表示元素的继承字体大小。

ex表示元素的x高度font。在带有“x”字母的字体上,这通常是字体中小写字母的高度; 1ex ≈ 0.5em在许多字体中。

ic等于在用于渲染它的字体中找到的“水”(CJK水表意文字,U + 6C34)字形的使用预先测量。

lh等于line-height使用它的元素的属性的计算值,转换为绝对长度。rem表示font-size根元素(通常<html>)。在根元素中使用时font-size,它表示其初始值(常见的浏览器默认值为16px,但用户定义的首选项可能会修改此值)。

rlh等于line-height根元素(通常<html>)上的属性的计算值,转换为绝对长度。当在根元素的font-sizeline-height属性上使用时,它引用属性的初始值。

视口百分比长度

vh等于视口初始包含块高度的1%。

vw等于视口初始包含块宽度的1%。

vi等于初始包含块大小的1%,在根元素的内联轴方向上。

vb等于初始包含块大小的1%,在根元素的块轴方向上。

vmin等于较小的vwvh

vmax等于较大vwvh

绝对长度单位

px一个像素。对于屏幕显示,它传统上代表一个设备像素(点)。但是,对于打印机高分辨率屏幕,一个CSS像素意味着多个设备像素。1px= 1/96 1in

cm一厘米。1cm96px/2.54

mm一毫米。1mm= 1/10 1cm

Q四分之一毫米。1Q= 1/40 1cm

in一英寸。1in2.54cm96px

pc一个异食癖。1pc12pt= 1/6 1in

pt一点。1pt= 1/72 1in

mozmm ,在Firefox 59中删除。

时间<time>

s表示以秒为单位的时间。例如:0s1.5s-60s

ms表示以毫秒为单位的时间。例如:0ms150.25ms-60000ms

fr单位

可以使用任何长度单位定义轨道。网格还引入了一个额外的长度单元来帮助我们创建灵活的网格轨道。新fr单元表示网格容器中可用空间的一小部分。下一个网格定义将创建三个相等宽度的轨道,根据可用空间增长和缩小。

css之单位的更多相关文章

  1. css大小单位px em rem的转换和详解

    css大小单位px em rem的转换和详解 PX特点1. IE无法调整那些使用px作为单位的字体大小:2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位:3. Firefox能 ...

  2. CSS的单位及css3的calc()及line-height百分比

    锚点:css中百分比减去固定元素 单位介绍 说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着 ...

  3. 移动H5开发入门知识,CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

  4. H5移动端开发入门知识以及CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

  5. 2.css字体单位

    这期简单说说css字体单位 字体单位有三种:px.em.rem 任意浏览器的默认字体高都是16px.所有未经调整的浏览器都符合: 1em=16px. % 百分比 in 英寸 cm 厘米 mm 毫米 e ...

  6. css常用单位

    css常用单位 本文来简单介绍下css的常用单位. 绝对长度单位 绝对长度单位代表一个物理测量. 像素px(pixels) 在web上,像素px是典型的度量单位,很多其他长度单位直接映射成像素.最终, ...

  7. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  8. css中单位em和rem的区别

    在css中单位长度用的最多的是px.em.rem,这三个的区别是: px是固定的像素,一旦设置了就无法因为适应页面大小而改变. em和rem相对于px更具有灵活性,他们是相对长度单位,意思是长度不是定 ...

  9. CSS的单位 及 css3的calc() 及 line-height 百分比

    CSS的单位及css3的calc()及line-height百分比 摘自:http://www.haorooms.com/post/css_unit_calc 单位介绍 说到css的单位,大家应该首先 ...

随机推荐

  1. 3-1. 基于epoll架构的视频采集端设计

    精通epoll架构 epoll:Linux中最优秀的多路复用机制! 与select .poll区别 1.select和poll没有太大区别,除了select有文件描述符限制(1024个).select ...

  2. Base64编码与解码原理

    Base64编码是使用64个可打印ASCII字符(A-Z.a-z.0-9.+./)将任意字节序列数据编码成ASCII字符串,另有“=”符号用作后缀用途. base64索引表 base64编码与解码的基 ...

  3. 如何在VMwareWorkstation中安装Ubuntu系统

    文章更新于:2020-03-17 注:如果安装之后重启停留在Write through,则关闭客户机,将 ISO 镜像换为物理光驱,或取消勾选开机连接.再次开机即可正常进入系统. 文章目录 一.安装环 ...

  4. Flutter 实现网易云音乐字幕

    老孟导读:没有接触过音乐字幕方面知识的话,会对字幕的实现比较迷茫,什么时候转到下一句?看了这篇文章,你就会明白字幕so easy. 先来一张效果图: 字幕格式 目前市面上有很多种字幕格式,比如srt, ...

  5. 23 抽象类 abstract

    /*概念 * abstract:关键字,用于修饰方法和类 * 抽象方法:不同类的方法是相似,但是具体内容又不太一样,所以我们只能抽取他的声明,没有具体的方法体,没有具体方法体的方法就是抽象方法 * 抽 ...

  6. Array(数组)对象-->数组的访问

    1.访问数组: 通过指定数组名以及索引号码,你可以访问某个特定的元素. 格式: 数组对象名[下标] 例如:arr[0]  就是访问数组第一个值 var arr = new Array(3); arr[ ...

  7. 《面试经典系列》- SpringMVC原理及工作流程

    前言 SpringMVC 作为 MVC 的开源框架,现在依旧是不少项目使用的重点框架.SpringMVC = Struts2 + Spring,SpringMVC就相当于 Struts2 + Spri ...

  8. transaction 用tx事务 测试时 报错:Unable to locate Spring NamespaceHandler for XML schema namespace [http://www.springframework.org/schema/mvc]

    Unable to locate Spring NamespaceHandler for XML schema namespace [http://www.springframework.org/sc ...

  9. mysql 主键和默认 设为索引的规则

    一.mysql 表中如果是单主键的话,那这个主键也会被 系统默认建为 索引 二.mysql 表中如果是复合主键的话,那系统会遵循左对齐原则,即如复合主键 a 和 b字段和c字段..., 默认建的主键索 ...

  10. 小小的锁,大大的疑问?Lock疑问?

    Lock锁 怎么使用?怎么把下面的这个锁弄得比较合适,大家都能去买票?? 和synchronized相比的好处? lock的使用规范try finnally private final Reentra ...