Qt ------ CSS 长度单位
1. css相对长度单位
Ø em 元素的字体高度
Ø ex 字体x的高度
Ø px 像素Pixels
Ø % 百分比Percentage
2. css绝对长度单位
Ø in 英寸Inches(1英寸=2.54厘米)
Ø cm 厘米Centimeters
Ø mm 毫米millimetre
Ø pt 点Points(1点=1/72英寸)
Ø pc 皮卡Picas(1皮卡=12点)
3. 单位em的说明
em指字体高,任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合:1em=16px。那么12px=0.75em。但是em并不是固定的,它会继承父级元素的字体大小。你可能会在content这个div里把字体大小设为1.2em, 也就是12px。然后你又把选择器p的字体大小也设为1.2em,但如果p属于content的子级的话,p的字体大小就不是12px,而是1.2em= 1.2 * 12px=14.4px。这是因为content的字体大小被设为1.2em,这个em值继承其父级元素body的大小,也就是16px * 62.5% * 1.2=12px, 而p作为其子级,em则继承content的字体高,也就是12px。所以p的1.2em就不再是12px,而是14.4px。
4. 单位pt的说明
在印刷排版中,point是一个绝对值,它等于1/72英寸,可以用尺子丈量的,物理的英寸。但是在css中pt含义却并非如此。因为我们的显示器被分割为了一个个的像素,单个像素只能有一种颜色 (为了简化,这里暂不讨论次像素反锯齿技术),要在屏幕上显示,必须先把以 pt 为单位的长度转换为以像素为单位的长度,这个转换的媒介,就是 DPI (事实上,这里的所谓的 DPI,是操作系统和浏览器中使用的术语,即为 PPI, pixels per inch,和扫描仪、打印机、数码相机中的 DPI 是不同的概念)。
例如,无论在哪个操作系统中,Firefox 浏览器默认的 DPI 都是 96,那么实际上 9pt = 9 * 1/72 * 96 = 12px。
所以,虽然“DPI”中的“I”和“1pt 等于 1/72 inch”中的“inch”,都不代表物理上的英寸,但这两个单位互相之间是相等的,也就在相乘中约掉了。
那么,真实的物理长度怎么计算呢?请拿出一把尺子,丈量你的显示器的可见宽度 (我这里是 11.2992 英寸),除以横向分辨率 (我这里是 1024 像素),得到的就是每个像素的物理长度。
现在我们可以回答这样一个问题,网页上 9pt 的字体究竟占用了多宽的空间?答案是: 9 * 1/72 * 96 * 11.2992 / 1024 = 0.1324 英寸 = 0.3363 厘米。
5. pt和px
虽然pt是绝对单位,但是那只是针对输出设备而言的,在文字排版工具(word,abobe)中是非常有用的字体单位。不管显示器的分辨率是多少,打印在纸面上的结果是一样的。
但是网页主要为了屏幕显示,而不是为了打印等其他需要的。而px能够精确地表示元素在屏幕中的位置和大小。
当然。在dpi是96的情况下,9pt=12px。
Qt ------ CSS 长度单位的更多相关文章
- CSS长度单位
罗列了CSS中常用的长度单位及比较 单位 含义 em 相对于父元素的字体大小 ex 相对于小写字母"x"的高度 rem 相对于根元素字体大小 px 相对于屏幕分辨率而不是视窗大小: ...
- CSS长度单位及区别 em ex px pt in
1. css相对长度单位 Ø em 元素的字体高度 Ø ex 字体x的高度 Ø px ...
- CSS长度单位详解
序言 长度单位可以总体的分为绝对长度单位和相对长度单位.CSS中最为大家熟知的无疑是px和em,但与此同时还存在pt, rem, vw, vh等其他计量单位,使用好它们可以大大增长我们的开发效率.本篇 ...
- CSS长度单位:px和pt的区别
先搞清基本概念:px就是表示pixel,像素,是屏幕上显示数据的最基本的点:而pt就是point,是印刷行业常用单位,等于1/72英寸. 这样很明白,px是一个点,它不是自然界的长度单位,谁能说出一个 ...
- css长度单位学习(em,rem,px,vw,vh)
绝对长度单位 绝对长度单位代表一个物理测量 [像素px(pixels)] 像素,为影像显示的基本单位,译自英文"pixel",pix是英语单词picture的常用简写,加上英语单词 ...
- css中pt、px、em、ex、in等这类长度单位详细说明
在CSS样式表中,我们经常会看到pt, px,em,ex,in等这类长度单位.它们各是什么意思,有什么区别呢? 在CSS样式表中,长度单位分两种: 相对长度单位,如px, em等 绝对长度单位,如pt ...
- CSS的长度单位
对于css的长度单位真的有必要知道一下.那么css长度单位有哪些呢? 分成两大类: 1.绝对单位:不会因为其他元素的尺寸变化而变化.坚持自我. 2.相对单位:没有一个确定的值,而是由其他元素的尺寸影响 ...
- CSS选择器,属性前缀,长度单位,变形效果,过渡效果,动画效果
CSS3选择器 ·*通配选择器 ·E标签选择器 ·E#id ID选择器 ·E.class类选择器 ·E F包含选择器,后代选择器 ·E>F子包含选择器 ·E+F相邻兄弟选择器 ·E[foo]属性 ...
- Qt样式表之二:QSS语法及常用样式
一.简述 Qt样式表(以下统称QSS)的术语和语法规则几乎和CSS相同.如果你熟悉CSS,可以快速浏览以下内容.不熟悉的话可以先去W3School - CSS或者本人的CSS博客随笔简单了解一下. 在 ...
随机推荐
- R之RMySQL
linux,mysql和R的版本信息: Linux naci 3.19.0-16-generic #16-Ubuntu SMP Server version: 5.6.24-0ubuntu2 (Ubu ...
- [笔记] postgresql 流复制(streaming replication)
基本环境说明: os:FreeBSD 9.3 postgresql version: master:192.168.56.101 standby:192.168.56.102 安装过程略,基于pkg包 ...
- c++ Dynamic Memory (part 2)
Don't use get to initialize or assign another smart pointer. The code that use the return from get c ...
- 关于双系统下Ubuntu不能访问Windows中某个盘的问题
1.问题描述 在Ubuntu系统下访问Windows系统中磁盘时出现无法访问的情况,具体如下显示: 该问题为磁盘挂载错误,需要进行修复. 2.解决办法 (1)打开终端:如果没有安装ntfs ...
- Linux系统中增加swap空间大小
在我的树莓派pi3上编译dlib库时,发现由于内存不足导致编译失败.树莓派是1G内存,swap只有50M,因此将swap增加到500M,编译通过.具体设置方法如下: 使用free命令带上m参数,查看s ...
- 初学Objective - C语法之代码块(block)
一.block声明 1.无参数,无返回值: void (^sayHi)(); 2.有参数,有返回值: NSInteger (^operateOfValue)(NSInteger num); block ...
- windows系统,可以ping通IP但是不能ping通网址的解决方法
之前慌忙之中遇到过一次,当时是客户比较着急使用就没有怎么折腾,什么数据当时都没留下反正是各种方法都尝试过了,但是就是ping IP是可以通的,但是域名就是不解析,后来有个群友也是遇见了这个问题(我当时 ...
- 对ViewModel自定义约束
有时候我们常要对一些属性进行自定义的约束,可以这么做 using ListSys.Entity; using System; using System.Collections; using Syste ...
- 【Django】Django—Form两种解决表单数据无法动态刷新的方法
一.无法动态更新数据的实例 1. 如下,数据库中创建了班级表和教师表,两张表的对应关系为“多对多” from django.db import models class Classes(models. ...
- EL语法 ${person.id} 这里面的id指的是实例对象的成员变量
EL语法 ${person.id} 这里面的id指的是实例对象的成员变量