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 ...
随机推荐
- SpringBoot应用篇(二):SpringSecurity实现带验证码的登录认证 附代码
一.文章简介 本文简要介绍了spring security的基本原理和实现,并基于springboot整合了spring security实现了基于数据库管理的用户的登录和登出,登录过程实现了验证码的 ...
- 挖掘Dark Sky Maps(热的要死后,疯传的一个气温地图网站)
最近,各种朋友圈,社会媒体,都在疯传一张图,这张图显示的全球的气温图,本没有什么特别的,但是这张图的网站来源所展示的数据与气象局或者各种天气预报的温度值相差倒是不少,引来一片网友的吐槽. 但是,作为专 ...
- MySQL能否授予查看存储过程定义权限给用户
在其他RDBMS中,可以将查看某个存储过程(PROCEDURE)定义的权限给某个用户,例如在SQL Server中,可以单独将查看ProcedureName定义的权限授予UserA GRANT VIE ...
- django的使用INNODE的方式,排除错误MySQL Strict Mode is not set for database connection 'default'
出现如下错误: 解决办法: DATABASES = { 'default': { 'ENGINE': 'django.db.backends.mysql', 'NAME': 'mxshop', 'HO ...
- docker容器虚拟化技术
简单来说,在Windows系统下安装各种运行环境的坑简直不要太多了(● ̄(エ) ̄●),并不仅限于docker.Nginx.PHP.Python等等,我会尽详细写出实际过程中遇到的各种各样的奇葩问题 1 ...
- [日常] linux设置环境变量
比如首先在/etc/profile里面增加这几个环境变量 export PATH=$PATH:/mnt/f/ubuntu/goProject/go/binexport GOROOT=/mnt/f/ub ...
- java.lang.IllegalStateException: Cannot call sendError() after the response has been committe
1.问题描述 严重: Servlet.service() for servlet [default] in contextwith path [/OxygenCloud] threw exceptio ...
- Mybatis----resultMap类型详解
Mybatis----resultMap类型详解 这篇文章主要给大家介绍了关于Mybatis中强大的resultMap功能的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用Mybatis具 ...
- Vue小练习 02
用table标签渲染下面的数据, 最后一列为总分, 第一列为排名 scores = [ {name: 'Bob', math: 97, chinese: 89, english: 67}, {name ...
- Python中容易忽视的知识点
今天坐在实验室,觉得有点无聊,想了下,很久没写博客了,就来写一点,正好遇到了一个有意思的小问题,分享给大家. 首先我们通过一个小的实验来看一下内容: 不管是 Python2 还是 Python3 环境 ...