文档介绍：样式表
第六章
2
回顾
识别 Dreamweaver 工作区的不同组件
使用 Dreamweaver 设计网页
使用表格
创建层
使用表单
在网页上应用多媒体
3
目标
了解 DHTML
样式表
什么是样式表
为什么要使用样式表
样式表的语法规则
创建并使用样式表
4
DHTML简介
什么是DHTML
DHTML是一个用动态内容描述HTML页面的术语,它包括HTML、CSS和JavaScript技术,这三种技术通过文档对象模型(DOM)融合在一起。
使用DHTML技术,在客户端就可以动态地操纵数据或改变页面内容,产生动态效果,还可以达到一定的与用户交互的效果。
5
DHTML 的功能
动态样式
动态内容
定位
绝对位置
相对位置
数据绑定
可下载字体
脚本
对象结构
6
样式表简介
什么是样式表
用于描述文档如何在屏幕上显示
W3C推荐的样式表标准包括CSS和XSL
CSS主要用于HTML
XSL主要用于XML
CSS是一种用来装饰HTML的标记集合,是对HTML标记的一种扩展,可以进一步美化HTML页面
7
样式表的作用
覆盖浏览器
页面布局
可以重用
多个文档可以链接到一个样式表
8
样式表规则
样式规则
样式表
规则
用法:
RuleSelector {property:value;property: value; ... }
规则选择器
声明
属性
属性值
9
样式表中的选择器
简单选择器(仅描述元素,而不考虑该元素在文档结构中的位置)
HTML选择器--选择器是HTML标记的名称
类选择器—使用HTML元素的CLASS属性
ID选择器—使用HTML元素的ID属性
上下文选择器(引用元素的上下文)
10
HTML选择器示例
<HTML>
<HEAD>
<STYLE TYPE="text/css">
P{font-style:italic; font-weight:bold; color:limegreen}
</STYLE>
</HEAD>
<Body>
<P>这些选择器使用HTML元素的名称唯一的区别是删除了尖括号。</P>
</BODY>
</HTML>
HTML选择器示例