CSS中值的单位
1.颜色值
被各种浏览器支持,并且作为 CSS 规范推荐的颜色名称只有 16 种,如下表所示。
百分比表示
color: rgb(100%, 100%, 100%);
这个声明将红、蓝、绿 3 种原色都设置为最大值,结果组合显示为白色。相反,可以设置rgb(0%, 0%, 0%)
为黑色。3 个百分值相等将显示灰色,同理哪个百分值大就偏向哪个原色。
数值
color: rgb(255, 255, 255);
数字范围从 0~255,3 个数值相等将显示灰色,同理哪个数值大哪个原色的比重就会加大。
十六进制颜色
color: #ffffff;
从 0~255,实际上十进制的 255 正好等于十六进制的 FF,一个十六进制的颜色值等于 3 组这样的十六进制的值,它们按顺序连接在一起就等于红、蓝、绿3种原色。
2.绝对单位
相对单位与绝对单位相比显示大小不是固定的,它所设置的对象受屏幕分辨率、可视区域、浏览器设置以及相关元素的大小等多种因素影响。
1) em
em 单位表示元素的字体高度,它能够根据字体的 font-size 属性值来确定单位的大小。
2) ex
ex 单位根据所使用的字体中小写字母 x 的高度作为参考。在实际使用中,浏览器将通过 em 的值除以 2 得到 ex 的值。
3) px
px 单位是根据屏幕像素点来确定的。这样不同的显示分辨率就会使相同取值的 px 单位所显示出来的效果截然不同。
实际设计中,建议网页设计师多使用相对长度单位 em,且在某一类型的单位上使用统一的单位。如设置字体大小,根据个人使用习惯,在一个网站中,可以统一使用 px 或 em。
3.百分比
百分比也是一个相对单位值。百分比值总是通过另一个值来计算,一般参考父对象中相同属性的值。例如,如果父元素宽度为 500px,子元素的宽度为 50%,则子元素的实际宽度为 250px。
百分比可以取负值,但在使用中受到很多限制。