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常见的取值与单位的更多相关文章

  1. 转载—“Cache-control”常见的取值有private、no-cache、max-age、must-revalidate等

    转载自http://www.cnblogs.com/igin/archive/2008/05/04/1181056.html 网页的缓存是由HTTP消息头中的“Cache-control”来控制的,常 ...

  2. "Cache-control”常见的取值private、no-cache、max-age、must-revalidate及其用意

    http://www.cnblogs.com/kaima/archive/2009/10/13/1582337.html 网页的缓存是由HTTP消息头中的"Cache-control&quo ...

  3. (网页的缓存控制)HTML配置no-cache(备忘) “Cache-control”常见的取值

    HTML配置no-cache(备忘) No-cache配置 html表头如下 <meta http-equiv="Content-Type" content="te ...

  4. “Cache-control”常见的取值有private、no-cache、max-age、must-revalidate等

    网页的缓存由HTTP消息头中的"Cache-Control" 来控制的,常见的取值有private.no-cache.max-age.must-revalidate等,默认为pri ...

  5. web(六)css的基本语法、取值与单位

    css语法包含如下部分: 选择器:用于选择需要添加样式的元素. 属性(property):样式的属性名称,例如color代表颜色. 取值与单位:属性对应的值以及单位. 语法规则:css的某些固定语法. ...

  6. Java 中日期的几种常见操作 —— 取值、转换、加减、比较

    Java 的开发过程中免不了与 Date 类型纠缠,准备总结一下项目经常使用的日期相关操作,JDK 版本 1.7,如果能够帮助大家节约那么几分钟起身活动一下,去泡杯咖啡,便是极好的,嘿嘿.当然,我只提 ...

  7. 聊聊 Java 中日期的几种常见操作 —— 取值、转换、加减、比较

    Java 的开发过程中免不了与 Date 类型纠缠,准备总结一下项目经常使用的日期相关操作,JDK 版本 1.7,如果能够帮助大家节约那么几分钟起身活动一下,去泡杯咖啡,便是极好的,嘿嘿.当然,我只提 ...

  8. html5 自定义标签取值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 如何解决流程开发中SheetRadioButtonList页面取值问题

    分享一个常见的取值问题. 应用场景: SheetRadioButtonList控件,点击其中一项执行事件操作.如果是页面加载的情况下,值就无法取到. 具体原因如下: 我给SheetRadioButto ...

随机推荐

  1. Prometheus监控(二)

    Prometheus监控(二) 数据类型 Counter(计数器类型) Counter类型的指标的工作方式和计数器一样,只增不减(除非系统发生了重置),Counter一般用于累计值. Gauges(仪 ...

  2. swift冒泡排序,swift快速排序,swift归并排序,swift插入排序,swift基数排序

    import UIKit /// 冒泡 /// ///时O(n2),空O(1) 稳定排序 func Mysort(arr:[Int]) -> [Int]{ var transArr = arr ...

  3. 【pycharm】Unable to save settings: Failed to save settings. Please restart PyCharm解决

    1.Unable to save settings: Failed to save settings. Please restart PyCharm解决 将工程的.idea目录删掉,重启pycharm ...

  4. Matlab线性规划

    线性规划   线性规划的标准形式 \[\underset{x}{min}{\ c^Tx}\ s.t.\ Ax \leqslant b\]   例如,线性规划为: \[ \underset{x}{min ...

  5. RabbitMQ基础理解

    RabbitMQ基本理解 MQ是消息中间件,常见的有RabbitMQ,Kafka,RocketMQ,activeMQ 等,用于分布式系统中.作用有三点 解耦 异步 削峰 RabbitMQ 整体上是一个 ...

  6. JS原型链与instanceof底层原理

    一.问题: instanceof 可以判断一个引用是否属于某构造函数: 另外,还可以在继承关系中用来判断一个实例是否属于它的父类型. 老师说:instanceof的判断逻辑是: 从当前引用的proto ...

  7. 关于jQuery MiniUI

    jQuery MiniUI v3.0 jQuery MiniUI - 专业WebUI控件库.它能缩短开发时间,减少代码量,使开发者更专注于业务和服务端,轻松实现界面开发,带来绝佳的用户体验. http ...

  8. 基于 CAS 无锁实现的 Disruptor.NET 居然慢于 BlockingCollection,是真的吗?

    StackOverflow 有人说自己的Disruptor.NET 代码比 BlockingCollection 还有慢 2 倍,并且把完整代码贴出,楼下几个老外也的回复说了一堆,但是没研究出个所以然 ...

  9. 服务监控之 Spring Boot Admin.

    一.概述  开始阅读这篇文章之前,建议先阅读下<SpringBoot 之Actuator>,该篇文章提到 Spring Boot Actuator 提供了对单个Spring Boot的监控 ...

  10. Vue小练习 03

    """ 1.有以下广告数据(实际数据命名可以略做调整) ad_data = { tv: [ {img: 'img/tv/tv1.jpg', title: 'tv1'}, ...