由于样式表(CSS)各项就是由属性和值组成的，值的单位分为长度单位，百分比，颜色单位，URL单位等，因此很有必要搞清楚值的各种单位。在CSS中，各种单位与HTML中的有所不同，请注意区分。

一、长度单位
长度单位是Web页面设计中最常用的一个单位，在设计的时候需要为元素的位置、尺寸大小精确地定义一些值，以使其达到预期的效果。
CSS提高给人们精确控制网页的能力，这一点为人们所津津乐道。它允许人们定义外观、尺寸、空间及其他的样式。但是，如果设计者缺乏经验，不清楚如何给出一个尺寸和空间值，CSS所提高的控制同时也是一个比较困难的东西。因为一个设计者虽然可以决定某一个特殊的屏幕分辨率，但是不可能决定别人的视觉体验。

CSS的主要功能之一就是CSS定位，这个定位的概念即包括位置的定位，也包括尺寸的定位。无论哪一种，都需要使用长度单位。

在CSS中，长度是一种度量尺寸，用于宽度、高度、字号、字和字母间距、文本的缩排、行高、页边距、贴边、边框线宽以及许许多多的其他属性。

1．定义长度
长度单位一般是一个由两个字母组成的单位缩写，例如cm，pt，em等。

2．绝对长度单位
网页上经常使用的绝对长度单位包括厘米（cm）、毫米（mm）、英寸（in）、点（pt）、派卡（pc）等等。

绝对长度值的使用范围比较有限，只有在完全确定输出设备的具体情况下，才能使用绝对长度值。也就是说，绝对长度值最好用于打印机输出设备，如果是作为屏幕显示时，使用绝对长度值意义不大，应该尽量使用相对长度值。
　　 3．相对长度值
每一个浏览器都有其自己默认的通用尺寸标准，这个标准可以由系统决定，也可以由用户按照自己的喜好进行个性化设置。因此，这个默认值尺寸往往是用户觉得最适合的尺寸。于是使用相对长度值，就可以使各元素按照默认大小按比例进行缩放。这样就避免了产生一些显示方面的情况。其实，百分比单位以及关键字都能产生类似的效果。
CSS还支持下列三种长度的相对单位：em（当前字体中字母M的宽度）、ex（当前字体中字母X的高度）、px（一个象素的大小）。
　　使用em和ex的目的就是为所用的字体设置合适的宽度，而没有必要知道字体有多大，在显示时，可通过比较当前字体中的M和X来确定。字体越大，所对应的em和ex也就越大。
　　以象素为单位的长度是相对于显示器上的象素(或许为方形)的高度和宽度。影像的宽度和高度经常是以象素给出的。象素测量法通常不是个好方法。首先，象素的大小依分辩率变化较大，大多数用户都会将显示器设置成尽可能高的分辩率，从而导致象素太小而无法阅读。

二、百分比单位
　　由于在某些情况下，浏览器不能处理带小数的百分数，因此最好不用带小数的百分比。
　　百分比总是相对于另一个值来说的。那个值可以是长度单位或是其他的。每一个可以使用百分比值单位指定的属性同时也自定义了这个百分比值的参照值。大多数情况下，这个参照值是此元素本身的字体大小。

三、颜色单位
　　大量地使用图片可能会使网页富有生气。但是，每一个上过网的人都有为等待一个图片而焦虑不安的经历。其实，适当地在不同的部位使用不同的颜色，也能起到类似图片的效果，把读者的注意力吸引到关键的部分，然而，下载网页的时间却大幅度地减少了。
　　color属性用来定义一个元素的前景颜色，在大多数情况下，这个元素中所包含的使文本对象。使用color属性同时还可以用来决定一个元素边框的颜色。通用的定义颜色的语法是：color：颜色值。
　　定义颜色值最简单也最直接的方法是使用百分比值。在这种情况下，红、绿、蓝颜色值的等级用百分比数来确定。格式是：color:rgb(R%,G%,B%)。使用百分比值来指定颜色还有一个好处是它能够声明一组真正的数字，不论它的值是多少。
　　指定颜色的另一种方法是使用范围在0～255之间的整数来设置。格式是color:rgb(128,128，128)。
定义颜色的第三种方法是使用十六进制数组定义颜色。这种定义的方法对于经常进行程序设计的人来说比较熟悉。定义颜色时使用三个前后按顺序排列的十六进制数组表示，例如 “#FC0EA8”。这种定义的方式就是形如#RRGGBB的格式。即在红、绿、蓝的位置上添上需要的十六进制值。
　　定义颜色最后一种方法也最简单的方法是指定颜色的名称。例如如下所示的代码指定文本的颜色为紫色。

四、URL单位
　　URL单位和链接的地址有关。所谓URL就是“Uniform Resource Locator”的简写，链接是网页的灵魂。通过链接的方式可以使各个网页之间联接起来，使网站中众多的页面构成一个有机整体，使访问者能够在各个页面之间跳转。链接可以是一段文本，一幅图像或其他网页元素，当在浏览器中用鼠标单击这些对象时，浏览器可以根据其指示载入一个新的页面或者跳转到页面的其他位置。
　　在创建链接的过程中，路径是非常重要的。两种路径：绝对路径和相对路径，其中相对路径可分为和根目录相对的路径及和文当相对的路径。
　　绝对路径时含服务器协议（在网页上通常是http://或ftp://）的完全路径。绝对路径包含的是精确位置而不用考虑源文档的位置。但是如果目标文档被移动，则链接无效。创建对当前站点以外文件的链接时必须使用绝对路径。
　　和根目录相对的路径总是从当前站点的根目录开始。站点上的所有可以公开的文件都存放在站点的根目录下。和根目录相对的路径使用斜杠告诉服务器从根目录开始。例如，/index.html将链接到站点根目录下的index.html文件。如果要在内容经常被移动的环境中链接文件，那么使用和根目录相对的路径往往是最佳的方法。在使用与根目录相对的路径时，包含链接的文档在站点内移动，链接不会中断。但是，和根目录相对的路径和适合于本地查看站点，在这种情况下，可以使用和文档相对的路径。
　　注意：当在浏览器中按照本地方式预览文件时，和根目录相对的路径所链接的内容不会出现。这是因为浏览器不能像服务器那样识别站点根目录，要预览和根目录相对的路径所链接的内容，必须将文件放置到远程服务器并从那里进行查看。
　　和文档相对的路径是指和当前文档所在的文件夹相对的路径。例如文档test.swf在文件夹Flash中，它指定的就是当前文件夹内的文档。… /test.swf指定的则是当前文件夹上级目录中的文档；而/test/test.swf指定是 Flash文件夹下test文件夹中的test.swf文档。和文档相对的路径通常是最简单的路径，可以用来链接总是和当前文档在同一文件夹中的文件。

标签: CSS