`
ming_7755
  • 浏览: 36850 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

pt, px, DPI: 关于长度单位的误解

 
阅读更多
在印刷排版中,“point”是一个绝对的单位,它等于 1/72 英寸,可以用尺子丈量的,物理的英寸。但在 CSS 中 pt 的含义却非如此,例如我们指定一个字体是 9pt,我们会以为按照 CSS 规范,它等于:

9 * 1/72 = 1/8 inch

这是一个误解,因为我们的显示器被分割为了一个个的像素,单个像素只能有一种颜色 (为了简化,这里暂不讨论次像素反锯齿技术),要在屏幕上显示,必须先把以 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 厘米。


网址:http://blog.jjgod.org/2006/02/24/misleading-length-unit/
分享到:
评论

相关推荐

    基于PTPX的数字电路功耗仿真.docx

    基于PTPX的数字电路功耗仿真.docx

    PT功耗分析流程

    项目需要使用PTPX看一下工程的功耗,写了一个使用PTPX做功耗分析的流程。

    你知道CSS中长度单位pt、px、dpi的意思吗?

    要在屏幕上显示,必须先把以pt为单位的长度转换为以像素为单位的长度,这个转换的媒介,就是dpi(事实上,这里的所谓的dpi,是操作系统和浏览器中使用的术语,即为PPI,pixelsperinch,扫描仪、打印机、数码相机中的...

    CSS的em、px、pt长度单位转换示例

    1em=16px 1em=12pt 1px=1/16 em=0.0625em 1px=3/4 pt=0.75pt 1pt=1/12 em≈0.0833em 1pt=4/3 px≈1.3333px em、px、pt的转换工具如下,结果如无法除尽,小数点后面四舍五入到4位,我用“约等于”表示;如果可以除尽...

    front-length:前端长度单位

    前端长度单位 前端长度单位总结 1.相对长度单位 单位(相对长度) 含义 兼容性 demo em 相对于父元素的字体大小(line-height中设置em是继承当前元素的font-size的倍数) rem font size of the root element(相对于根...

    Android中的长度单位详解(dp、sp、px、in、pt、mm).pdf

    总算,把Android中要用到各种长度单位,讲清楚了,以前用的时候,总是不清不楚的。现在用得心里有底了。

    ptpx_trainging material

    A training material for lower power analysis in Synopsys primetime tool

    移动端网页字号pt px em换算对照表.pdf

    移动端网页字号pt px em换算对照表.pdf移动端网页字号pt px em换算对照表.pdf移动端网页字号pt px em换算对照表.pdf

    pt_user_guide.pdf

    时序分析工具pt的用户手册

    css长度单位参考

    在CSS样式表中,我们经常会看到pt, px,em,ex,in等这类长度单位。它们各是什么意思,有什么区别呢?在CSS样式表中,长度单位分两种: 相对长度单位,如px, em等,绝对长度单位,如pt,mm等。

    android布局单位sp,dp,pt,px的区别

    android布局单位sp,dp,pt,px的用法和区别。

    普通校园网页模板以及一些网站素材

    FONT-SIZE: 9pt; COLOR: #333333; TEXT-DECORATION: none } A { TEXT-DECORATION: none } BODY { FONT-SIZE: 9pt; LINE-HEIGHT: 1.5; FONT-FAMILY: "宋体" } H2 { FONT-SIZE: 15pt; FONT-FAMILY: "黑体" } H3 { ...

    CSS长度单位 px和pt的区别

    先搞清基本概念:px就是表示pixel,像素,是屏幕上显示数据的最基本的点;而pt就是point,是印刷行业常用单位,等于1/72英寸。

    超酷页面左侧导航菜单

    WIDTH: 215px; POSITION: relative; HEIGHT: 40px } #cover { VISIBILITY: hidden; OVERFLOW: hidden; WIDTH: 215px; POSITION: absolute; HEIGHT: 40px } #cuscroll { LEFT: 0px; VISIBILITY: inherit; WIDTH: ...

    css中的px、em、rem、pt 特点和区别及换算详解

    1、px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度,需要指定精度DPI(Dots Per Inch,每英寸像素数),在扫描打印时一般都有DPI可选。Windows系统默认是96dpi,...

    PT教程 --- 来自CCFBits

    第二章 什么是PT (Private Tracker)? 第三章 一般PT站的规则和优惠机制 PT规则概念入门 PT下载要注意的事项 PT站优惠机制: 第四章 PT的优缺点 PT的优点: PT的缺点: 第五章 国内外著名PT站介绍(略读)...

    Javascript 手工打造:随意拖动的div层

    包含开始拖动,停止拖动,释放的功能 (this,event)" onMouseMove="drag(this,event)" onMouseUp="stopDrag(this)" ... font-size: 9pt; color: #FFFFFF; padding-top: 5px; padding-left: 5px;">浮动窗口 实例。</div>

Global site tag (gtag.js) - Google Analytics