HTML语言网页设计ppt课件.ppt

《HTML语言网页设计ppt课件.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、HTML语言与网页设计——CSS技术1学习目标理解CSS技术在网页制作过程中所起的重要作用，掌握CSS样式定义的方法。掌握三种在网页中使用CSS样式的方法，并对比各自的优劣。理解各种CSS属性的含义，掌握常用属性的用法。2Part1CSS基础3什么是CSSCSS（CascadingStyleSheet，层叠样式表）是一种格式化网页的标准方式，它扩展了HTML的功能，使网页设计者能够以更有效的方式设置网页格式。4演示——样式的作用无样式层叠样式表示例5样式定义的语法样式表项的组成：Selector

2、{property1:value1;property2:value2;property3:value3;……}Selector定义样式作用的对象，property为CSS属性，value为属性对应的值。6样式定义的语法H1{text-align:center;font-family:黑体}选择器样式定义样式属性属性取值7常用Selector类型HTML标记符用户定义的类用户定义的ID虚类8HTMLSelectorHTML标记符是最常用的selector，它重新定义了HTML标记符的显示效果。例如

3、：H1{text-align:center;color:red}使所有用H1标记符修饰的内容都居中和用红色显示。9演示——HTMLSelector效果10用户定义类.classname{property:value…}表示任何class属性为classname的标记符都采用所定义的样式。11用户定义ID#idname{property:value…}表示任何ID属性为idname的标记符都采用所定义的样式。用户定义ID与class的作用完全相同，一般使用其中之一即可。12演示—通用类与ID13虚

4、类Selector:link未访问过的超链接:visited访问过的超链接:active活动超链接:hover悬停状态的超链接14虚类Selector例如：所有超链接去下划线：a{text-decoration:none}悬停变色:hover{color:red}15演示——虚类selector效果16CSS属性单位长度单位：cm,em,ex,in,mm,pc,pt,px百分比单位颜色单位：颜色名,#RRGGBB,#RGB,rgb(rrr,ggg,bbb),rgb(rrr%,ggg%,bbb%

5、)17Part2在网页中使用CSS18直接在标记符中嵌套HTML标记符的style属性例如：其中，style属性的取值形式为：“CSS属性:CSS属性值”多个属性用分号分隔19演示——直接嵌套样式信息20在STYLE标记符定义样式样式定义的方式为Selector{property1:value1;property2:value2;property3:value3;……}21演示——用Style定义样式

6、22链接外部样式表文件LINK标记符样式表文件可以用文本编辑器编辑，也可以用FP或DW编辑，内容为样式定义。23演示——链接外部样式表文件24样式的优先级样式的优先级遵循“就近优先”的原则，也就是说，距离所修饰对象越近的样式，其优先级越高。样式如果冲突，则采用高优先级样式；如果不冲突，则采用叠加的样式效果。25样式的优先级

7、et"type="text/css"href="test.css">

正文内容