新JavaScript程序设计基础教程 教学课件 曾海 第9章 CSS+DIV技术.ppt

第9章 CSS+DIV技术 本章目录 9.1 CSS简介 9.2 样式定义 样式定义的格式 选择符的分类 选择符的分类 选择符的分类 9.3 样式定义 嵌入样式表 链接外部样式表 引入外部的样式表 内嵌样式 CSS样式的优先级 CSS样式的优先级 9.4 Style对象 9.4 Style对象 9.4 Style对象 9.5 CSS属性 字体属性 字体属性 字体属性 文本属性 文本属性 文本属性 文本属性 文本属性 颜色和背景属性 颜色和背景属性 颜色和背景属性 颜色和背景属性 颜色和背景属性 颜色和背景属性 容器属性 容器属性 列表属性 列表属性 列表属性 列表属性 鼠标属性 鼠标属性 定位和显示 定位和显示 定位和显示 CSS滤镜 CSS滤镜 CSS滤镜 CSS滤镜 9.6 CSS+DIV美化与布局页面 div标记与span标记 div标记与span标记 div标记与span标记 div标记与span标记 div与span的区别 div与span的区别 div与span的区别 用CSS+DIV实现指定尺寸无边框无滚动条窗口 用CSS+DIV实现指定尺寸无边框无滚动条窗口 用CSS+DIV实现指定尺寸无边框无滚动条窗口 习题 1．以下哪个选项不属于CSS样式的特点（ ）。 A．将显示格式和文档结构分离 B．体积更小加快网页下载速度 C．对HTML语言处理样式的最好补充 D．实现动态更新、增强工作量 2．在CSS样式中以下哪个选项（）不属于选择符的分类。 A．HTML选择符 B．Class选择符 C．ID选择符 D．#选择符 3．若要在网页中实现两个DIV对象重叠效果，需要应用样式表定义中的（ ）。 A．z-index属性 B．容器属性 C．绝对位置与相对位置属性 D．CSS滤镜 CSS的颜色属性允许设计者指定页面元素的颜色，背景属性用于指定页面的背景颜色或者背景图像的属性。颜色和背景属性如表9.7所示。 下面是对颜色和背景属性的详细讲解。 （1）color设定颜色 语法： color：color-value HTML语言使用十六进制的RGB颜色值对颜色进行控制，即颜色可以通过英文名称或者十六进制来表现。如标准的红色，可以用RED作为名称来表现，也可以用#FF0000作为十六进制来表现。能够使用的预设颜色命名总共有140种，常用的有16种：Black、Olive、Teal、Red、Blue、Maroon、Navy、Gray、Lime、Fuchsia、White、Green、Purple、Silver、Yellow和Aqua。 （2）background-color设定背景颜色 语法： background-color：color-value （3）background-image设定背景图像 语法： background-image：none | url(url) none：无背景图。 url(url)：使用绝对或相对地址指定背景图像。不仅可以输入本地图像文件的路径和文件名称，也可以用URL的形式输入其他位置的图像名称。 页面中可以用JPG或者GIF图片作为背景图，这与向网页中插入图片不同，背景图像放在网页的最底层，文字和图片等都位于其上。 （4）background-repeat设定背景图像平铺 语法： background-repeat：repeat | repeat-x | repeat-y | no-repeat 背景图像平铺属性值如表9.8所示。 （5）background-attachment设定背景图像是否跟随页面内容滚动 语法： background-attachment：scroll | fixed scroll：背景图像跟随页面内容滚动。 fixed：背景图像固定。 （6）background- position设定背景图像位置 语法： background- position：[value] | [top| center| bottom] | [left| center| right] 背景图像位置属性可以确定背景图像的绝对位置，这是HTML标记不具备的功能。该属性只能用于块级元素和替换元素（包括img，input，textarea，select和object）。背景图像位置属性值如表9.9所示。 （7）background设定背景综合属性 语法： background：background-color ||background-image ||background-repeat ||background-attachment ||background- position 如果使用该复合