CSS学习总结系列5——值和单位

值和单位

1. 数字、百分数
2. 长度、颜色、URI 、关键字
3. CSS2中定义的其他值和单位

在样式表中，每个属性都有相应的值与之对应，值用来确定属性的最终效果。值可以取为关键字、数字、百分数、文件位置或者默认值，在样式表中，默认值是指当样式表中某个属性没有定义值或没有定义某个属性时属性中默认使用的值。

数字、百分数

1. 数字

CSS中有两类数字：整数和实数。实数由整数、小数点和小数三部分组成。数字可以为负数。

2. 百分数

百分比值定义的长度要参考其他元素的长度。 百分比值的写法是：%数字。其中数字可正可负。

长度、颜色、URI、关键字

长度单位可以表示为数字加具体单位，可以划归为两类，绝对长度单位和相对长度单位。

1. 绝对长度单位

在为打印文档定义样式时比较有用，但是在网页设计中很少使用。包括英寸(in)、厘米(cm)、毫米(mm)、磅(pt)、派卡(pc/pica)。

2. 相对长度单位

相对长度单位是网页中使用最多的长度单位，包括em(相对于当前的字体尺寸)、ex(相对于所用字体中“x”的高度。浏览器通常取该字体尺寸的一半)、像素px(IE7前版本不支持调整文本大小)。

CSS2.1建议96ppi为像素缩放的参考像素(CSS2建议90ppi)。

CSS颜色可以通过颜色名称、RGB值和十六进制数字表示。RGB颜色是我们最常使用的.它可以表现出16777216种颜色。

1. 颜色名称

在CSS2.1中，CSS规范定了17个颜色名称。这包括HTML4.01中定义的16个颜色，并外加一个橙色。

2. RGB数字值、RGB百分比值

语法：rgb(num1,num2,num3)、RGB(x%,x%,x%)。

含义： num为范围0~255的整数、x%的范围0%~100%。

3. 十六进制数字值

语法：#RRGGBB。

含义：将三个介于00~FF之间的十六进制数连起来设置一种颜色。等价与RGB数字值的方法。如果3组数各自都是成对的，还可以简写为#RGB。

Web安全颜色

Web安全颜色是指在256色计算机系统上总能避免抖动的颜色。

Web安全颜色可以表示为RGB值20%和51（相应的十六进制值为33）的倍数。

采用十六进制记法，使用值00、33、66、99、CC和FF的三元组认为是Web安全的。这说明Web安全颜色的简写十六进制值是0、3、6、9、C和F。

RGBA表示方式(CSS3特有):目前还不被多数浏览器支持。 RGBA是在RGB的基础上增加了alpha通道。

R代表红(red)

G代表绿(green)

B代表蓝(blue)

A代表不透明度(alpha的缩写)

URL在CSS2.1中称为URI。一般格式为url(path)。url和开始括号之间不能由空格。可以归类为绝对路径(absolute URL)和相对路径(relative URL)。

1. 相对路径

相对路径用来指定内容的相对地址。这个地址可以是相对于文档所在的当前目录，也可以是相对于指定的基本的路径。在CSS药性对于样式表本身。

2. 绝对路径

绝对路径用来指定内容的绝对地址。在绝对路径中，一般要使用http协议和域名等内容。在CSS为样式文件的完整路径。

关键字用某个词来描述属性的值。在CSS2.1中inherit关键字是所有属性共有的inherit使一个属性的值与其父元素的值相同。可以使继承的样式优先于用户代理的样式。（注1）

角度、时间、频率

这些单位包含在CSS2中，并没有在CSS2.1中定义，它们可能是将来CSS版本的一部分。

1. 角度值

用于定义给定的声音从哪个位置发出。共有3种角度：度(deg)、梯度(grad)和弧度(rad)。这些值都会解释为0~360°范围内的度数，负数值也是如此。

2. 时间值

用于指定语音元素之间的延迟。可以表示为毫秒(ms)、秒(s)。时间值不能为负值。

3. 频率值

用于为语音浏览器可以产生的声音声明一个给定频率，可以表示为赫兹(Hz)、兆赫(MHz)(字母不区分大小写)。频率值不能为负值。

216种Web安全颜色

    

        

            
#000000
            
#000033
            
#000066
            
#000099
            
#0000CC
            
#0000FF
        
        

            
#003300
            
#003333
            
#003366
            
#003399
            
#0033CC
            
#0033FF
        
        

            
#006600
            
#006633
            
#006666
            
#006699
            
#0066CC
            
#0066FF
        
        

            
#009900
            
#009933
            
#009966
            
#009999
            
#0099CC
            
#0099FF
        
        

            
#00CC00
            
#00CC33
            
#00CC66
            
#00CC99
            
#00CCCC
            
#00CCFF
        
        

            
#00FF00
            
#00FF33
            
#00FF66
            
#00FF99
            
#00FFCC
            
#00FFFF
        
        

            
#330000
            
#330033
            
#330066
            
#330099
            
#3300CC
            
#3300FF
        
        

            
#333300
            
#333333
            
#333366
            
#333399
            
#3333CC
            
#3333FF
        
        

            
#336600
            
#336633
            
#336666
            
#336699
            
#3366CC
            
#3366FF
        
        

            
#339900
            
#339933
            
#339966
            
#339999
            
#3399CC
            
#3399FF
        
        

            
#33CC00
            
#33CC33
            
#33CC66
            
#33CC99
            
#33CCCC
            
#33CCFF
        
        

            
#33FF00
            
#33FF33
            
#33FF66
            
#33FF99
            
#33FFCC
            
#33FFFF
        
        

            
#660000
            
#660033
            
#660066
            
#660099
            
#6600CC
            
#6600FF
        
        

            
#663300
            
#663333
            
#663366
            
#663399
            
#6633CC
            
#6633FF
        
        

            
#666600
            
#666633
            
#666666
            
#666699
            
#6666CC
            
#6666FF
        
        

            
#669900
            
#669933
            
#669966
            
#669999
            
#6699CC
            
#6699FF
        
        

            
#66CC00
            
#66CC33
            
#66CC66
            
#66CC99
            
#66CCCC
            
#66CCFF
        
        

            
#66FF00
            
#66FF33
            
#66FF66
            
#66FF99
            
#66FFCC
            
#66FFFF
        
        

            
#990000
            
#990033
            
#990066
            
#990099
            
#9900CC
            
#9900FF
        
        

            
#993300
            
#993333
            
#993366
            
#993399
            
#9933CC
            
#9933FF
        
        

            
#996600
            
#996633
            
#996666
            
#996699
            
#9966CC
            
#9966FF
        
        

            
#999900
            
#999933
            
#999966
            
#999999
            
#9999CC
            
#9999FF
        
        

            
#99CC00
            
#99CC33
            
#99CC66
            
#99CC99
            
#99CCCC
            
#99CCFF
        
        

            
#99FF00
            
#99FF33
            
#99FF66
            
#99FF99
            
#99FFCC
            
#99FFFF
        
        

            
#CC0000
            
#CC0033
            
#CC0066
            
#CC0099
            
#CC00CC
            
#CC00FF
        
        

            
#CC3300
            
#CC3333
            
#CC3366
            
#CC3399
            
#CC33CC
            
#CC33FF
        
        

            
#CC6600
            
#CC6633
            
#CC6666
            
#CC6699
            
#CC66CC
            
#CC66FF
        
        

            
#CC9900
            
#CC9933
            
#CC9966
            
#CC9999
            
#CC99CC
            
#CC99FF
        
        

            
#CCCC00
            
#CCCC33
            
#CCCC66
            
#CCCC99
            
#CCCCCC
            
#CCCCFF
        
        

            
#CCFF00
            
#CCFF33
            
#CCFF66
            
#CCFF99
            
#CCFFCC
            
#CCFFFF
        
        

            
#FF0000
            
#FF0033
            
#FF0066
            
#FF0099
            
#FF00CC
            
#FF00FF
        
        

            
#FF3300
            
#FF3333
            
#FF3366
            
#FF3399
            
#FF33CC
            
#FF33FF
        
        

            
#FF6600
            
#FF6633
            
#FF6666
            
#FF6699
            
#FF66CC
            
#FF66FF
        
        

            
#FF9900
            
#FF9933
            
#FF9966
            
#FF9999
            
#FF99CC
            
#FF99FF
        
        

            
#FFCC00
            
#FFCC33
            
#FFCC66
            
#FFCC99
            
#FFCCCC
            
#FFCCFF
        
        

            
#FFFF00
            
#FFFF33
            
#FFFF66
            
#FFFF99
            
#FFFFCC
            
#FFFFFF