用CSS设置图像与背景颜色.ppt

6.3.1 设置背景颜色 在 CSS 中，网页元素的背景颜色使用 background-color 属性来设置，属性值为 某种颜色。 31 第 2 章 CSS 选择器与相关特性 2.4 复合选择器 2.5 CSS 的继承特性 1 2.4 复合选择器 2.4.1 交集选择器 2 2.4.1 交集选择器 h3.special .special h3 图 2.14 交集选择器示意图 3 2.4.1 交集选择器 style type= ext/css p{color: blue ; /* 标记选择器 */ } .special{color: green ; /* 类别选择器 */ } p.special{color: red ; /* 标记 . 类别选择器 */ } /style /head body h3 普通标题文本 /h3 p 普通段落文本 /p h3 class=special 指定了 .special 类别的标题文本 /h3 p class=special 指定了 .special 类别的段落文本 /p /body 4 2.4.2 并集选择器 h3 .special h3 , .special 图 2.16 并集选择器示意图 h3, p{ /* 并集选择器 */ color:purple; /* 文字颜色 */ font-size:15px; /* 字体大小 */ } 5 2.4.2 并集选择器 style type= ext/css h1, h2, h3, p{ /* 并集选择器 */ color:purple; /* 文字颜色 */ font-size:15px; /* 字体大小 */ } h2.special, .special, #one{ /* 集体声明 */ text-decoration:underline; /* 下画线 */ } /style /head body h1 示例文字 h1/h1 h2 class=special 示例文字 h2/h2 h3 示例文字 h3/h3 p 示例文字 p1/p p class=special 示例文字 p2/p p id=one 示例文字 p3/p /body /html 6 2.4.3 后代选择器 html head title 后代选择器 /title style type= ext/css p span{color:red; /* 嵌套声明 */ } span{color:blue; } /style /head body h3 嵌套之外的 span 标记（蓝色） /span 不生效 /h3 p 嵌套使 span 用 CSS （红色） /span 标记的方法 /p /body /html 7 2.4.3 后代选择器 a{background-color:#FFFF00; } #navi a{text-decoration:none; color:#FFFFFF; } /style /head body a href=irst.htmlimg src=images/title.gif / div id= avi a href=#files/a a href=#edit/a a href=#see/a a href=#format/a /div /body 8 2.5 CSS 的继承特性 图 2.20 包含多层列表的页面 body h1 前沿 emWeb 开发 /em 教室 /h1 ul liWeb 设计与开发需要使用以下技术： ul liHTML/li liCSS ul li 选择器 /li li 盒子模型 /li li 浮动与定位 /li /ul /li liJavascript/li /ul /li li 此外，还需要掌握： ol liFlash/li liDreamweaver/li liPhotoshop/li /ol /li /ul p 如果您有任何问题，欢迎联系我们 /p /body 9 html head body title h1 ul li p li ul ol ul li li li li li li li li li em 父 子 父 子 图 2.21 继承关系树型图 10 2.6 CSS 的层叠特性 （ 1 ）行内式 嵌入式 外部式。 （ 2 ）特殊性越高的元素，其样式的优先级越 高。 （ 3 ）外部样式中，出现在后面的优先级高于 出现在前面的。 11 第 6 章 用 CSS 设置文本和图象 6.1 使用 CSS 设置文字样式 6.2 使用 CSS 设置图象样式 6.3 使用 CSS 设置背景样式 12 6.2 用 CSS 设置图