CSS/tutorials/lesson3

来自开放百科 - 灰狐
2010年10月16日 (六) 02:11Allen (讨论 | 贡献)的版本

跳转到: 导航, 搜索

目录

第3课:颜色与背景

本课,你将学习如何在网站上应用颜色与背景。我们还会介绍用于定位和控制背景图像的高级方法。本课将对下列CSS属性进行讲解:

  • color 前景色
  • background-color 背景色
  • background-image 背景图像
  • background-repeat 平铺背景图像
  • background-attachment 固定背景图像
  • background-position 放置背景图像
  • background 缩写

color

前景色:‘color’属性

CSS属性color用于指定元素的前景色。

例如,假设你要让页面中的所有标题(headline)都显示为深红色,而这些标题采用的都是h1元素,那么可以用下面的代码来实现把h1元素的前景色设为红色。

h1 {
color: #ff0000;
}

Icon-example.gif 显示示例

颜色值可以用十六进制表示(比如上例中的#ff0000),也可以用颜色名称(比如“red”)或RGB值(比如rgb(255,0,0))表示。

background-color

‘background-color’属性

CSS属性background-color用于指定元素的背景色。

因为body元素包含了HTML文档的所有内容,所以,如果要改变整个页面的背景色的话,那么为body元素应用background-color属性就行了。

你也可以为其他包含标题或文本的元素单独应用背景色。在下例中,我们为body和h1元素分别应用了不同的背景色。

body {
 background-color: #FFCC66;
}
h1 {
 color: #990000;
 background-color: #FC9804;
}

Icon-example.gif 显示示例

注意:我们为h1元素应用了两个CSS属性,它们之间以分号(“;”)分隔。

background-image

background-repeat

background-attachment

background-position

background

Comment-32x32.png

<discussion>characters_max=300</discussion>

分享您的观点
个人工具
名字空间

变换
操作
导航
工具箱