在CSS样式表中，我们经常会看到pt， px，em <script type="text/javascript">arw("|Jo", ark7);</script> ，ex，in等这类长度单位。它们各是什么意思，有什么区别呢？
<script type="text/javascript">arw("_Om", ark5);</script> 在CSS样式表中，长度单位分两种：
- 相对长度单位，如px, em等
- 绝对长度单位，如pt,mm等
也谈px和pt的区别
resolution)。不管是用pt还是用px设置的字体。
经常看 <script type="text/javascript">arw("|h7", ark3);</script> 到有人拿px和pt比较，主要是为了争辩 <script type="text/javascript">arw("#7l", ark6);</script> 在确定字体大小(font-size)或其它CSS属性大小时，用什么样的CSS长度单位更加好。有人说，用pt更好，因为pt是绝对长度单位 <script type="text/javascript">arw("+cK_gL", ark0);</script> ，不会因为屏幕分辨率大小，或者其它因素而改变。
我去做了一个测试，写了这样一个HTML例子。代码如下：
<html>
<head <script type="text/javascript">arw("=mqhT?mZXT", ark0);</script> ><title>CSS单位长度区别 - px和pt的区别</title></head>
<body >
<p style = <script type="text/javascript">arw("@31VFCE", ark3);</script> "font-size:20pt;">Font-size is 20pt <script type="text/javascript">arw("?vhjK", ark2);</script> </p>
<p style = "font-size <script type="text/javascript">arw(">M", ark1);</script> :20px;">Font-size is 20px</p>
<script type="text/javascript">arw(">D9sW=iCAcL=b51^", ark7);</script> </body>
</html <script type="text/javascript">arw("=nO5S", ark4);</script> >
<script type="text/javascript">arw("_H8", ark6);</script> 我去做了一个测试，写了这样一个HTML例子。代码如下？
我将 <script type="text/javascript">arw("]Vd", ark7);</script> 我的显示器分别调到1024*768和800*600的分辨率(指screen resolution)。不管是用pt还是用px设置的字体，都随着分辨率变化而变化。(我使用的浏览器是IE6，其它浏览器上尚未测试过。)
我又写了另外一个HTML例子 <script type="text/javascript">arw("+cK", ark0);</script> ，测试一下cm(厘米 <script type="text/javascript">arw("=w%wL", ark4);</script> )。代码如下：
<html>
<script type="text/javascript">arw(">D9sWJfDF>DIsW=bM1^EKsMG>DIsWqTr!IK-vD-Aw,wY}Ph-BH-92=V>J>9Bs>IoI-HZEn|W5,ov,ke>SkEn>61jE9f>ShEn>D9sW=i4Gb0=b51^", ark7);</script> <head><title>CSS长度单位的区别 - pt,px和cm的区别</title></head>
<script type="text/javascript">arw("@36Wi", ark3);</script> <body >
以下div宽度300pt，高度30pt： <br>
<div style = "width:300pt;height:30pt;b <script type="text/javascript">arw("UX", ark0);</script> order <script type="text/javascript">arw("?V", ark6);</script> :1px solid blue;"></div>
以下div宽度300px，高度30px：<br>
<div style = "width <script type="text/javascript">arw("=j", ark4);</script> :300px;height:30px;b <script type="text/javascript">arw("8W", ark4);</script> order:1px solid blue;"></div <script type="text/javascript">arw("?xpDE", ark6);</script> >
以下div宽度10cm，高度3cm： <br>
<div style = "width:10cm;height:3cm;border <script type="text/javascript">arw("=i", ark0);</script> :1px solid blue;"></div>
<script type="text/javascript">arw("=mfhT?vnixe?msXT", ark0);</script> </body>
<script type="text/javascript">arw("=mfhT", ark0);</script> </html>
结果是，cm(厘米)也是随着显示器分辨率变化而变化的。
对于计算机的屏幕设备而言，像素(Pixel)或者 <script type="text/javascript">arw("!Bl", ark1);</script> 说px是一个最基本的单位，就是一个点 <script type="text/javascript">arw("*W7", ark1);</script> 。其它所有的单位，都和像素成一个固定的比例换算关系。所有的长度单位基于屏幕进行显示的时候 <script type="text/javascript">arw(")bJ", ark6);</script> ，都统一先换算成为像素的多少，然后进行显示 <script type="text/javascript">arw("%PP", ark6);</script> 。所以，就计算机的屏幕而言，相对长度和绝对长度没有本质差别。任何单位其实都是像素，差别只是比例不同。
如果把讨论扩展到其它输出设备，比如打印机，基本的长度单位可能 <script type="text/javascript">arw("!yL#Sp", ark5);</script> 不是像素，而是其它的和生活中的度量单位一致的单位了。
CSS绝对长度单位是对于输出设备(output device <script type="text/javascript">arw(">;", ark1);</script> )而言的。拿pt来 <script type="text/javascript">arw(")6A|Jo", ark7);</script> 说，这是一个在文字排版工具(word <script type="text/javascript">arw("?l", ark2);</script> ,a <script type="text/javascript">arw("JV", ark4);</script> dobe等)中非常常用的字体单位，不管你的显示器分辨率是1024*768，还是800*600，同一篇文档打印在纸面上的结果是一样的。
写网页用哪个长度单位更好，是px还是pt呢？
我个人比较偏向px <script type="text/javascript">arw(")bJ", ark6);</script> ，因为px能够精确地表示元素在屏幕中的位置和大小，网页主要是为了屏幕显示，而不是为了打印等其它需要的。
CSS相对长度单位(relative length unit)
CSS相对长度单位中的相对二字，表明了其长度单位会随着它的参考值的变化而变化，不是固定的。
以下是CSS相对长度单位列表 <script type="text/javascript">arw("+c0", ark0);</script> ：
| CSS相对长度单位 | <script type="text/javascript">arw("#^3-xt", ark3);</script> 说明 |
| em | 元素的字体高度The height of the element's font |
| ex | 字母x的高度The height of the letter "x" |
| px | 像素Pixels |
| % | 百分比Percentage |
CSS绝对长度单位(absolute length unit)
绝对长度单位是一个固定的值 <script type="text/javascript">arw("}Jo", ark4);</script> 。比如 <script type="text/javascript">arw("]Vd", ark7);</script> 我们常用的有mm，就 <script type="text/javascript">arw("_5n", ark2);</script> 是毫米的意思。
以下 <script type="text/javascript">arw("}ue", ark1);</script> 是CSS绝对长度单位列表：
| <script type="text/javascript">arw("Dra&GZ$61(w7$HS$Yh%Ip", ark7);</script> CSS绝对长度单位 | <script type="text/javascript">arw("-di#SI", ark5);</script> 说明 |
| in | 英寸Inches (1 英寸 = 2.54 厘米) |
| cm | 厘米Centimeters |
| mm | 毫米Millimeters |
| pt | 点Points (1点 = 1/72英寸) |
| pc | 皮卡Picas (1 皮卡 = 12 点) |
2639
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
