几点说明
中文翻译版可能包含错误,应以 W3C 官方网站的英文原版为准
上方导航栏中可以查看每个小贴士的英文原版及繁體中文版
版权信息在页面最下方
如果你指定了一种颜色,请指定所有的颜色
数量惊人的网站为其正文、标题和链接设置了各种各样的颜色,唯独忘记了设置背景颜色。因为你的访客可能在他们浏览器的偏好设置中指定了不同的颜色,他们有可能:
- 看到不协调或令人不舒服的颜色搭配。
- 更坏的情况是,如果访客浏览器的偏好设置是浅色字体配深色背景,而你的站点设置为深色字体配浅色背景,那么,访客可能会看不清楚网页上的文字,因为变成了深色文字在深色背景上,反之亦然。
避免这些问题的经验法则是:如果你指定了一种颜色,必须指定所有的颜色,包括背景色。
推荐实例
忘掉 <font>,使用 CSS
使用级联样式表在网页中设置颜色的方法不仅是新式的,也是很好的。我们强烈推荐使用这种方法来取代在 HTML 中使用 <body> 属性和 <font> 元素的方法,因为 CSS 更灵活,更容易维护,而且能节省带宽。下面将讲述如何使用 CSS 属性 <color> 和 <background-color> 或其简写 <background> 来指定颜色。
一个例子
背景色、前景色,和链接的颜色都被指定为黑色字体白色背景。
html, body {
background: #fff;
color: #000;
}
a:link {
background: #fff;
color: #037;
}
a:visited {
background: #fff;
color: #636;
}
延伸阅读
Some of the advice here differs from ours.
- What's wrong with the FONT element? by Warren Steel
- Effective Color Contrast - Designing for People with Partial Sight and Color Deficiencies by Aries Arditi
- When Bad Design Elements Become the Standard by Jakob Nielsen
- Let Users Control Font Size by Jakob Nielsen
- See also the W3C CSS Validation Service
关于“优质小贴士”
The W3C 优质小贴士 是为网页开发者和设计者提供的一些有用的小短文,由 W3C 的 Quality Assurance Interest Group 负责管理和辑写。中文版由 ZDYX(张杜一雄)维护。
虽然这些小贴士都被小组成员认真审查过,但这只是我们向你提供的点滴技巧。请注意,它们 不能 被认为是 W3C 的技术规范。
学习更多的技巧,了解怎样提交你自己的智慧点滴,以及阅读其他的优质小贴士,尽在 小贴士索引。
