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

《html+css+javascript 标准实例教程(第二版)14.ppt》由会员分享，可在线阅读，更多相关《html+css+javascript 标准实例教程(第二版)14.ppt（37页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

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版）HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.1 设置颜色设置颜色c

2、olor语法说明 关键字：颜色关键字就是用颜色的英文名称来设置颜色。例如：“red”代表红色，“black”代表黑色等。RGB值：在CSS中，RGB值有多种表示方式，如十六进制的RGB值和RGB函数值都行。HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.1 设置颜色设置颜色color实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.1 设置颜色设置颜色color接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.1 设置颜色设置颜色color网页效果HTML/CSS/JavaScript 标准教程

3、实例版（第2版）第章1414.1 设置颜色设置颜色color网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.2 设置背景颜色设置背景颜色background-color基本语法background-color:关键字关键字|RGB值值|transparentHTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.2 设置背景颜色设置背景颜色background-color语法说明 关键字和RGB值可参照上一节“14.1设置颜色color”中的语法说明。transparent表示透明值，是背景颜色background-color属性的初

4、始值。HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.2 设置背景颜色设置背景颜色background-color实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.2 设置背景颜色设置背景颜色background-color接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.2 设置背景颜色设置背景颜色background-color网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.3 插入背景图片插入背景图片background-image基本语法backgr

5、ound-image:url|noneHTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.3 插入背景图片插入背景图片background-image语法说明 URL指定要插入的背景图片路径或名称，路径可以为绝对路径也可以为相对路径。第6章有绝对路径和相对路径的详细内容讲解。图片的格式一般以GIF、JPG和PNG格式为主。none是一个默认值，表示没有背景图片。HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.3 插入背景图片插入背景图片background-image实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）

6、第章1414.3 插入背景图片插入背景图片background-image接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.3 插入背景图片插入背景图片background-image网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.4 插入背景附件插入背景附件background-attachment基本语法background-attachment:scroll|fixedHTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.4 插入背景附件插入背景附件background-attachment语

7、法说明 scroll表示背景图片是随着滚动条的移动而移动。是浏览器的默认值。fixed表示背景图片固定在页面上不动，不随着滚动条的移动而移动。HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.4 插入背景附件插入背景附件background-attachment实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.4 插入背景附件插入背景附件background-attachment接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.4 插入背景附件插入背景附件background-attachment

8、网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.5 设置重复背景图片设置重复背景图片background-repeat基本语法background-repeat:repeat|repeat-x|repeat-y|no-repeatHTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.5 设置重复背景图片设置重复背景图片background-repeat语法说明HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.5 设置重复背景图片设置重复背景图片background-repeat实例代码HTML/CSS/J

9、avaScript 标准教程实例版（第2版）第章1414.5 设置重复背景图片设置重复背景图片background-repeat接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.5 设置重复背景图片设置重复背景图片background-repeat网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.6 设置背景图片位置background-position基本语法background-position：百分比：百分比|长度长度|关键字关键字HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.6 设置背

10、景图片位置background-position语法说明 利用百分比和长度设置图片位置时，都要指定两个值，并且这两个值要用空格隔开。一个代表水平位置，一个代表垂直位置。水平位置的参考点是网页页面的左边，垂直位置的参考点是页面的上边。关键字在水平方向的主要有left、center、right，表示居左、居中和居右。关键字在垂直方向的主要有top、center、bottom，表示顶端、居中和底端。其中水平方向和垂直方向的关键字可相互搭配使用。使用百分比和关键字对比说明background-position属性的属性值。附表14-2HTML/CSS/JavaScript 标准教程实例版（第2版）第章

11、1414.6 设置背景图片位置background-position实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.6 设置背景图片位置background-position接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.6 设置背景图片位置background-position网页效果HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.7 小实例小实例综合设置颜色和背景综合设置颜色和背景实例代码HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.7 小实例小实例综合设置颜色和背景综合设置颜色和背景接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.7 小实例小实例综合设置颜色和背景综合设置颜色和背景接上页HTML/CSS/JavaScript 标准教程实例版（第2版）第章1414.7 小实例小实例综合设置颜色和背景综合设置颜色和背景网页效果