单位 描述                                                                                                                                                原文                                                            
em 它是描述相对于应用在当前元素的字体尺寸，所以它也是相对长度单位。一般浏览器字体大小默认为16px，则2em == 32px； Represents the calculated font-size of the element. If used on the font-size property itself, it represents the inherited font-size of the element.
ex 依赖于英文子母小 x 的高度     Represents the x-height of the element's font. On fonts with the "x" letter, this is generally the height of lowercase letters in the font; 1ex ≈ 0.5em in many fonts.                                                                                                                  
cap 表示元素字体的“顶高”（大写字母的大写字母）。 Represents the "cap height" (nominal height of capital letters) of the element’s font.
ic 等于使用预先测量的“水”(CJK水表意文字,U + 6 c34)字形字体用于呈现它 Equal to the used advance measure of the "水" (CJK water ideograph, U+6C34) glyph found in the font used to render it.
lh 等于所使用元素的行高属性的计算值，转换为绝对长度。 Equal to the computed value of the line-height property of the element on which it is used, converted to an absolute length.
rlh 等于根元素(通常)上的行高属性的计算值，转换为绝对长度。当用于根元素的字体大小或行高属性时，它指的是属性的初始值 Equal to the computed value of the line-height property on the root element (typically <html>), converted to an absolute length. When used on the font-size or line-height properties of the root element, it refers to the properties' initial value.
ch 数字 0 的宽度    Represents the width, or more precisely the advance measure, of the glyph "0" (zero, the Unicode character U+0030) in the element's font.
rem 根元素（html）的 font-size Represents the font-size of the root element (typically <html>). When used within the root element font-size, it represents its initial value (a common browser default is 16px, but user-defined preferences may modify this).
vw viewpoint width，视窗宽度，1vw=视窗宽度的1% Equal to 1% of the width of the viewport's initial containing block.
vh viewpoint height，视窗高度，1vh=视窗高度的1% Represents the "cap height" (nominal height of capital letters) of the element’s font
vmin vw和vh中较小的那个。

Equal to the smaller of vw and vh.
vmax vw和vh中较大的那个。 Equal to the larger of vw and vh.
vi 在根元素的内嵌轴的方向上，等于初始包含块大小的1%。 Equal to 1% of the size of the initial containing block, in the direction of the root element’s inline axis.
vb 在根元素的块轴的方向上，等于初始包含块大小的1%。 Equal to 1% of the size of the initial containing block, in the direction of the root element’s block axis.
%       数据类型由一个数字组成，后面跟着百分比符号（%）。可选地，它可能在前面有一个+或-符号，尽管负的值对所有属性都无效。和所有CSS维度一样，在这两者之间没有空格 The <percentage> data type consists of a <number> followed by the percentage sign (%). Optionally, it may be preceded by a single + or - sign, although negative values are not valid for all properties. As with all CSS dimensions, there is no space between the symbol and the number.
cm     厘米 One centimeter. 1cm = 96px/2.54.
mm 毫米 One millimeter. 1mm = 1/10th of 1cm.
in 英寸 (1in = 96px = 2.54cm) One inch. 1in = 2.54cm = 96px.
px  像素 (1px = 1/96th of 1in) One pixel. For screen displays, it traditionally represents one device pixel (dot). However, for printers and high-resolution screens, one CSS pixel implies multiple device pixels. 1px = 1/96th of 1in.
pt 像素 (1px = 1/96th of 1in) One point. 1pt = 1/72nd of 1in.
pc pica，大约6pt，1/6英寸； (1pc = 12 pt) One pica. 1pc = 12pt = 1/6th of 1in.
deg 表示角度的角度。一个完整的圆是360度。 Represents an angle in degrees. One full circle is 360deg. Examples: 0deg, 90deg, 14.23deg.
grad 表示倾斜角度的角度。一个完整的圆圈是400。 Represents an angle in gradians. One full circle is 400grad. Examples: 0grad, 100grad, 38.8grad.
rad 表示弧度的角度。一个完整的圆是2弧度，近似于6。 Represents an angle in radians. One full circle is 2π radians which approximates to 6.2832rad. 1rad is 180/π degrees. Examples: 0rad, 1.0708rad, 6.2832rad.
turn 在许多回合中代表一个角度。一个完整的圆是1圈。 Represents an angle in a number of turns. One full circle is 1turn. Examples: 0turn, 0.25turn, 1.2turn.
HZ 代表赫兹的频率 Represents a frequency in hertz. Examples: 0Hz, 1500Hz, 10000Hz.
KHZ 千赫兹 Represents a frequency in kilohertz. Examples: 0kHz, 1.5kHz, 10kHz.
s 秒 Represents a time in seconds. Examples: 0s, 1.5s, -60s.
ms 毫秒 Represents a time in milliseconds. Examples: 0ms, 150.25ms, -60000ms.
fr 数据类型被指定为一个数字，后面是单元fr。fr单元表示网格容器中剩余空间的一小部分。与所有CSS维度一样，单元与数字之间没有空格。 The <flex> data type is specified as a <number> followed by the unit fr. The fr unit represents a fraction of the leftover space in the grid container. As with all CSS dimensions, there is no space between the unit and the number.

CSS中的各种单位的更多相关文章

  1. css中的各种单位简述以及ios10下safari禁止缩放的问题

    px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值. rem:相对 ...

  2. css中字体常用单位px、em、rem和%的区别及用法总结

    一.px.em.rem和%的定义 1.px(像素) px单位的名称为像素,它是一个固定大小的单元,像素的计算是针对(电脑/手机)屏幕的,一个像素(1px)就是(电脑/手机)屏幕上的一个点,即屏幕分辨率 ...

  3. CSS中的尺寸单位

    绝对单位 px: Pixel 像素 pt: Points 磅 pc: Picas 派卡 in: Inches 英寸 mm: Millimeter 毫米 cm: Centimeter 厘米 q: Qua ...

  4. [css 实践篇]CSS中的尺寸单位

    绝对单位 px: Pixel 像素 pt: Points 磅 pc: Picas 派卡 in: Inches 英寸 mm: Millimeter 毫米 cm: Centimeter 厘米 q: Qua ...

  5. CSS中的自适应单位vw、vh、vmin、vmax

    1.vw.vh.vmin.vmax各单位的意义 上面的自适应单位可以统称为视口单位. 可以先了解一下视口指的是什么? 在PC端,视口指的是在PC端,指的是浏览器的可视区域:而在移动端,它涉及3个视口: ...

  6. css中vw,vh单位对于UC的兼容性问题

    vw,vh单位在移动端浏览器不兼容,在网上找半天也没找到什么官方的解决方法:我就试了一下在使用到vh的单位之前添加一个用px定义的样式: 如: 当浏览器不是别100vw单位的时候 就会赋给px单位的样 ...

  7. css中font-size的单位总结：px、em、pt

    px:基于像素的单位.像素是一种有用的单位,因为在任何媒体上都可以保证一个像素的差别确实是可见的.em :一般用来测量长度的通用单位(例如元素周转的页边空白和填充),当用于指定字体大小时,em单位是指 ...

  8. CSS 中的 em单位

    em的对应的像素值如何计算,一言以蔽之:em就是倍数当前元素font-size的倍数,其结果就是当前字体的像素值乘以em的值,至于font-size来自何处?有两个来源:继承自父元素和通过CSS直接设 ...

  9. 一起来看看css中的单位

    一起来看看css中的单位 由于一直以来对于css中的百分比单位究竟是相对于谁的比例,这个问题不是很了解,所以就专门找资料看了一下. <div class="container w500 ...

随机推荐

  1. Mysql高手系列 - 第9篇：详解分组查询，mysql分组有大坑！

    这是Mysql系列第9篇. 环境:mysql5.7.25,cmd命令中进行演示. 本篇内容 分组查询语法 聚合函数 单字段分组 多字段分组 分组前筛选数据 分组后筛选数据 where和having的区 ...

  2. 在一个升序数组中添加最少的数字，使得从1--n之间所有的数都能用数组中几个数的和表示

    一个Java的笔试题上面遇到的题,当时没有做出来. 拆分: 序列升序 1--n所有的数都要能表示 用数组中数字的和表示 添加最少的数字 思路:这个要先从小的数开始表示,因为大的数可以用小数表示. 1- ...

  3. map转java对象

    pom依赖: <dependency> <groupId>commons-beanutils</groupId> <artifactId>commons ...

  4. springboot logback日志的使用

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

  5. FJUT - OJ优先队列专题题解

    题目链接http://120.78.128.11/Contest.jsp?cid=18 题面不贴了 都是英文题,看的我心力憔悴 =7= 一.Ugly Numbers 题目说一个数的质因数只包含2.3或 ...

  6. 带你入门SpringCloud统一配置 | SpringCloud Config

    前言 在微服务中众多服务的配置必然会出现相同的配置,如果配置发生变化需要修改,一个个去修改然后重启项目的方案是绝对不可取的.而 SpringCloud Config 就是一个可以帮助你实现统一配置选择 ...

  7. 网络编程之socket模块

    一.TCP协议 TCP是可靠的.面向连接的协议(eg:打电话).传输效率低全双工通信(发送缓存&接收缓存).面向字节流.使用TCP的应用:Web浏览器:电子邮件.文件传输程序. 二.基于TCP ...

  8. Day4 文件管理-常用命令

    文件管理 --> 创建 移动 删除 复制 1.cp复制: #####-v:详细显示命令执行的操作 #####-r: 递归处理目录与子目录 #####-p: 保留源文件或目录的属性 #####1. ...

  9. elasticsearch document的索引过程分析

    elasticsearch专栏:https://www.cnblogs.com/hello-shf/category/1550315.html 一.预备知识 1.1.索引不可变 看到这篇文章相信大家都 ...

  10. js控制input框输入数字时，累计求和

    input框输入数字时,自动开始计算累加 <div class="form-group"> <label for="inputPassword3&quo ...