html+css+javascript 标准实例教程(第二版)14

《html+css+javascript 标准实例教程(第二版)14》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、本书编委会编著实例版第14章颜色和背景14.1设置颜色——color14.2设置背景颜色——background-color14.3插入背景图片——background-image14.4插入背景附件——background-attachment14.5设置重复背景图片——background-repeat14.6设置背景图片位置——background-position14.7小实例——综合设置颜色和背景14.8习题HTML/CSS/JavaScript标准教程实例版（第2版）14.1设置颜色——color语法说明关键字：颜色关键字

2、就是用颜色的英文名称来设置颜色。例如：“red”代表红色，“black”代表黑色等。RGB值：在CSS中，RGB值有多种表示方式，如十六进制的RGB值和RGB函数值都行。14.1设置颜色——color实例代码14.1设置颜色——color接上页14.1设置颜色——color网页效果14.1设置颜色——color网页效果14.2设置背景颜色——background-color基本语法background-color:关键字

3、RGB值

4、transparent14.2设置背景颜色——background-color语法说明关键字和RGB值

5、可参照上一节“14.1设置颜色——color”中的语法说明。transparent表示透明值，是背景颜色background-color属性的初始值。14.2设置背景颜色——background-color实例代码14.2设置背景颜色——background-color接上页14.2设置背景颜色——background-color网页效果14.3插入背景图片——background-image基本语法background-image:url

6、none14.3插入背景图片——background-image语法说明URL指定要插入的背

7、景图片路径或名称，路径可以为绝对路径也可以为相对路径。第6章有绝对路径和相对路径的详细内容讲解。图片的格式一般以GIF、JPG和PNG格式为主。none是一个默认值，表示没有背景图片。14.3插入背景图片——background-image实例代码14.3插入背景图片——background-image接上页14.3插入背景图片——background-image网页效果14.4插入背景附件——background-attachment基本语法background-attachment:scroll

8、fixed14.4插入背景附件——

9、background-attachment语法说明scroll表示背景图片是随着滚动条的移动而移动。是浏览器的默认值。fixed表示背景图片固定在页面上不动，不随着滚动条的移动而移动。14.4插入背景附件——background-attachment实例代码14.4插入背景附件——background-attachment接上页14.4插入背景附件——background-attachment网页效果14.5设置重复背景图片——background-repeat基本语法background-repeat:repeat

10、repeat-

11、x

12、repeat-y

13、no-repeat14.5设置重复背景图片——background-repeat语法说明14.5设置重复背景图片——background-repeat实例代码14.5设置重复背景图片——background-repeat接上页14.5设置重复背景图片——background-repeat网页效果14.6设置背景图片位置——background-position基本语法background-position：百分比

14、长度

15、关键字14.6设置背景图片位置——background-position语法说明利用百分比和长

16、度设置图片位置时，都要指定两个值，并且这两个值要用空格隔开。一个代表水平位置，一个代表垂直位置。水平位置的参考点是网页页面的左边，垂直位置的参考点是页面的上边。关键字在水平方向的主要有left、center、right，表示居左、居中和居右。关键字在垂直方向的主要有top、center、bottom，表示顶端、居中和底端。其中水平方向和垂直方向的关键字可相互搭配使用。使用百分比和关键字对比说明background-position属性的属性值。附表14-214.6设置背景图片位置——background-position表14-2b

17、ackgorund-position属性取值说明返回14.6设置背景图片位置——background-position实例代码14.6设置背景图片位置——background-position接上页14.6