HTML5常见的取值与单位
HTML5常见的取值与单位
长度单位包括
相对长度单位包括:em, ex, ch, rem, vw, vh, vmax, vmin
绝对长度单位包括:cm, mm, q, in, pt, pc, px
ch:数字“0”的宽度
em:相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。
ex:相对长度单位。相对于字符“x”的高度。通常为字体高度的一半。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。
rem:相对于根元素(即html元素)font-size计算值的倍数
vw:相对于视口的宽度。视口被均分为100单位的vw
vh:相对于视口的高度。视口被均分为100单位的vh
vmax:相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax
vmin:相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax
cm:厘米 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
mm:毫米 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
q:1/4毫米 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
in:英寸 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
pt:点 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
pc:派卡 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
px:像素 1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px
| Pixels | EMs | Percent | Points |
|---|---|---|---|
| 6px | 0.375em | 37.5% | 5pt |
| 7px | 0.438em | 43.8% | 5pt |
| 8px | 0.5em | 50% | 6pt |
| 9px | 0.563em | 56.3% | 7pt |
| 10px | 0.625em | 62.5% | 8pt |
| 11px | 0.688em | 68.8% | 8pt |
| 12px | 0.75em | 75% | 9pt |
| 13px | 0.813em | 81.3% | 10pt |
| 14px | 0.875em | 87.5% | 11pt |
| 15px | 0.938em | 93.8% | 11pt |
| 16px | 1em | 100% | 12pt |
| 17px | 1.063em | 106.3% | 13pt |
| 18px | 1.125em | 112.5% | 14pt |
| 19px | 1.188em | 118.8% | 14pt |
| 20px | 1.25em | 125% | 15pt |
| 21px | 1.313em | 131.3% | 16pt |
| 22px | 1.375em | 137.5% | 17pt |
| 23px | 1.438em | 143.8% | 17pt |
| 24px | 1.5em | 150% | 18pt |
HTML5常见的取值与单位的更多相关文章
- 转载—“Cache-control”常见的取值有private、no-cache、max-age、must-revalidate等
转载自http://www.cnblogs.com/igin/archive/2008/05/04/1181056.html 网页的缓存是由HTTP消息头中的“Cache-control”来控制的,常 ...
- "Cache-control”常见的取值private、no-cache、max-age、must-revalidate及其用意
http://www.cnblogs.com/kaima/archive/2009/10/13/1582337.html 网页的缓存是由HTTP消息头中的"Cache-control&quo ...
- (网页的缓存控制)HTML配置no-cache(备忘) “Cache-control”常见的取值
HTML配置no-cache(备忘) No-cache配置 html表头如下 <meta http-equiv="Content-Type" content="te ...
- “Cache-control”常见的取值有private、no-cache、max-age、must-revalidate等
网页的缓存由HTTP消息头中的"Cache-Control" 来控制的,常见的取值有private.no-cache.max-age.must-revalidate等,默认为pri ...
- web(六)css的基本语法、取值与单位
css语法包含如下部分: 选择器:用于选择需要添加样式的元素. 属性(property):样式的属性名称,例如color代表颜色. 取值与单位:属性对应的值以及单位. 语法规则:css的某些固定语法. ...
- Java 中日期的几种常见操作 —— 取值、转换、加减、比较
Java 的开发过程中免不了与 Date 类型纠缠,准备总结一下项目经常使用的日期相关操作,JDK 版本 1.7,如果能够帮助大家节约那么几分钟起身活动一下,去泡杯咖啡,便是极好的,嘿嘿.当然,我只提 ...
- 聊聊 Java 中日期的几种常见操作 —— 取值、转换、加减、比较
Java 的开发过程中免不了与 Date 类型纠缠,准备总结一下项目经常使用的日期相关操作,JDK 版本 1.7,如果能够帮助大家节约那么几分钟起身活动一下,去泡杯咖啡,便是极好的,嘿嘿.当然,我只提 ...
- html5 自定义标签取值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 如何解决流程开发中SheetRadioButtonList页面取值问题
分享一个常见的取值问题. 应用场景: SheetRadioButtonList控件,点击其中一项执行事件操作.如果是页面加载的情况下,值就无法取到. 具体原因如下: 我给SheetRadioButto ...
随机推荐
- 操作MyBatis引发Error setting null for parameter #X with JdbcType OTHER .无效的列类型
再用MyBatis操作Oracle的时候,传入null值而引发的错误 异常信息: org.springframework.jdbc.UncategorizedSQLException: Error s ...
- 一分钟教你编写Linux全局内置命令
前言:在linux命令使用中,有些命令总是又长又难记,就算是经常使用的命令每次都敲也真的很烦,所以今天教大家一个方法,来简化命令,创建我们自己的内建命令!!! 创建内置命令 创建命令存储目录 现在li ...
- 小程序实现日期时间控件picker
小程序自带的组件中有日期跟时间的picker,但就缺个日期时间picker组件,那没办法,只能自己弄一个,这个组件不是很难,比较难的地方是要根据不同年份(是否闰年)跟月份决定一个月里有多少天. 我直接 ...
- 1.Ansible自动化管理工具
1.Ansible基本概述 Ansible是一个IT自动化的配置管理工具,自动化主要体现在Ansible集成了丰富模块,丰富的功能组件, 可以通过一个命令行完成一系列的操作.进而能减少我们重复性的工作 ...
- 使用ul和li进行图片的布局
使用ul和li进行浮动布局(自适应) 1 图片上下两排: 首先盒子的宽度要给100% ul包裹一个div,首先量好盒子的宽和高,并进行设置, margin 0 auto 盒子居中显示 每个li向左浮动 ...
- 如何在Mac上使用Netstat命令
macOS上的netstat命令是一个终端命令,用于显示有关Mac网络通信的详细信息.网络通信包括Mac通过所有端口和所有应用程序与外界进行交流的所有方式.掌握netstat可以帮助您了解计算机之间的 ...
- JavaScript-----11.预解析
1.预解析 1.1引子 //1问 console.log(num);//报错 num未定义 //2问 console.log(num); //undefined 未报错 var num = 10; / ...
- java之递归
什么是递归 递归:指在当前方法内调用自己的这种现象. 递归的分类: 递归分为两种,直接递归和间接递归. 直接递归称为方法自身调用自己. 间接递归可以A方法调用B方法,B方法调用C方法,C方法调用A方法 ...
- 【洛谷5643】[PKUWC2018] 随机游走(Min-Max容斥+待定系数法+高维前缀和)
点此看题面 大致题意: 从一个给定点出发,在一棵树上随机游走,对于相邻的每个点均有\(\frac 1{deg}\)的概率前往.多组询问,每次给出一个点集,求期望经过多少步能够访问过点集内所有点至少一次 ...
- vuetify,vux,Mint UI 等框架的选择
vuetify: https://vuetifyjs.com/zh-Hans/getting-started/quick-start NutUI:https://github.com/jdf2e/nu ...