《CSS权威指南第三版》第四章的读书笔记

4 值和单位

  1. 数字

CSS中有两类数字:整数和实数(小数)。整数和实数都可以是正数或负数,属性通常会限制所允许的数字范围。

  1. 百分数

百分数值几乎总是相对于另一个值。这个值可能是同一元素另一个属性的值,也可以是从父元素继承的一个值,或者是祖先元素的一个值。属性会对允许的百分数值有限制。

  1. 颜色

可以按名称使用为数不多的几种颜色,如redpurple;还使用十六进制代码。还有其他新增的更直观的方法。

  1. 命名颜色

CSS2.1定义了17个颜色名:aqua fuchsia lime olive red white blackgray maroon orange silver yellow blue green navy purple teal

大多数Web浏览器能识别多达140个颜色名称。另外的这些颜色都在CSS3颜色规范中定义。

  1. RGB指定颜色

RGB色彩模式是工业界的一种颜色标准,是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的。

  1. 函数式RGB颜色

百分数记法的百分数在0%100%,若超出范围将被记作0%100%,如指定黑色和白色:

rgb(100%,100%,100%)

rgb(0%,0%,0%)

整数三元组记法只能使用整数,如指定黑色和白色:

rgb(255,255,255)

rgb(0,0,0)

  1. 十六进制RGB颜色

一般语法是#RRGGBB。一种简写记法是#RGB,浏览器会将每一位复制为两位。#F00等价于#FF0000

  1. 颜色汇总

本书P.89

更多CSS颜色信息: http://www.w3school.com.cn/cssref/css_colors.asp

  1. Web安全颜色

指在256色计算机系统上总能避免抖动的颜色。可表示为RGB20%51(十六进制33)的倍数。十六进制记法,使用值00336699CCFF的三元组是Web安全的。

  1. 长度单位

长度单位可表示为正数或负数,其后跟有一个标签。一些标签只能用正数。0后不需要单位。

  1. 绝对长度单位

绝对长度单位容易理解。难以兼容不同的显示器,较少使用。

  1. 英寸in
  2. 厘米cm
  3. 毫米mm
  4. pt1英寸是72点。
  5. 派卡pc1派卡是12点,1英寸是6派卡。
  1. 相对长度单位

3种相对长度单位:emexpx

  1. emex单位

代表em-heightx-height

1em定义为一种给定字体的font-size值。ex是指所用字体中小写x的高度。

  1. emex的实际问题

一般地,用户代理假设1ex等于0.5em,这不足够精确。

  1. 像素长度

按像素设置字体大小,不能很好支持IE浏览器。像素适合用来度量图像大小。

  1. 像素理论

不同显示器和打印机的ppi不同,因此像素是一种相对度量单位。

  1. 如何取舍?

总地来说,em是最灵活的,因为它随字体大小缩放,元素和元素操作都能更为一致。

对于元素其他方面,更适合使用像素,如元素的边框或定位。

  1. URL

绝对URL不论将文档放在哪里都能正常工作,一般格式:

url(protocol://server/pathname);

相对URL指定的是一个相对于该URL所在文档的位置,一般格式:

url(pathname);

导入样式表的例子:

@import url(special/toppings.css);

注意,url和开始括号之间不能有空格。

  • 关键字

如果一个属性接受关键字,那么其关键字将只针对该属性的作用域定义。两个属性用同一个词作关键字,二者含义可能不同。

  • inherit

inherit这个关键字是所有属性共有的。它使一个属性的值与其父元素的值相同。

  1. CSS2单位

这些单位没有包含在CSS2.1中。

  1. 角度值

3种角度:度deg,梯度grad,弧度rad

  1. 时间值

毫秒ms,秒s;时间不能是负值。

  1. 频率值

赫兹Hz,兆赫MHz;频率不能是负值,单位不分大小写。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值