dreamweavercs5CSS层叠样式表和Spry面板的应用试卷.ppt

编辑AP Div 2．更改AP Div的大小 更改AP Div的大小的操作如下所示。 选择AP Div。 执行下列操作之一，选择AP Div。 编辑AP Div 3．删除AP Div 删除AP Div的操作如下所示。 选择AP Div。 执行以下操作之一，删除AP Div。 嵌套的AP Div 可以使用嵌套的AP Div进行更精细的页面布局。具体操作方法如下所示。 定义AP Div的层次 在Dreamweaver中可以定义AP Div的显示层次，当AP Div互相重叠的时候，会根据AP Div的显示层次显示AP Div，具体操作方法如下所示。 AP Div和表格之间的转换 在Dreamweaver中可以将AP Div转换为表格，也可以将表格转换为AP Div。下面分别讲解转换的方法。 1．将AP Div转换为表格 AP Div和表格之间的转换 2．将表格转换为AP Div 将AP Div转换为表格，可以执行以下操作。 Spry面板的应用 插入Spry选项卡式面板 插入Spry折叠式面板 插入Spry可折叠面板 例子： 小结：通过本章节使学生学会 css的设置 ，以及Div的插入，spry面板的应用等。 教学重点：本章主要向学生介绍CSS的设置，以及Div的插入，spry面板的应用等。 教学目标： 1css的设置 2 Div的插入 3 spry面板的应用 CSS的简介 CSS的中文意思为层叠样式表，简称样式表。 所谓样式就是层叠样式表，用来控制一个文档中的某一文本区域外观的一组格式属性。CSS样式可以用来一次对若干文档所有的样式进行控制。 新建CSS的方法 1窗口——css样式 2快捷键shift+F11 3页面空白处单击鼠标右键，在弹出的快捷菜单中选择CSS样式——新建 CSS样式的分类 类：自定义css规则。可以将样式属性应用到任何文本范围或文本块。所有样式均以（.）开头。 标签：HTML标签规则重定义特定标签（如p或者hl）的格式。 复合标签 CSS面板的介绍 1新建css规则 2编辑样式 3删除规则 4只显示设置属性 5显示列表视图 6显示类别视图 CSS规则定义 一类型 font-family:文本的字体 font-size：文字尺寸大小 font-weight：字体的粗细效果，正常=400 粗体=700 font-style：设置字体风格 font-variant：设置文本的小型大写字母 line-height：控制行与行之间的垂直距离 text-transform：控制字母vde大小写 text-decoration：控制链接文本的显示状态。 color：颜色 2背景 background-color:背景颜色 background-image：背景图像 background-repeat：是否重复 background-attachment：确定背景图像固定在其原始位置还是随内容一起滚动。 background-positionx：水平 background-positiony：垂直 3区块 4方框 5边框 6列表 7定位 8扩展 滤镜 Alpaha 透明滤镜 Blur 模糊滤镜 Mask 遮罩 Xray x射线滤镜 Glow 光晕滤镜 Dropshadow 阴影滤镜 Gray 照片由彩色变为白色调 Invert 图片产生照片底片效果 Shawdow 阴影效果 Color 指定阴影的颜色 Direction 指定阴影的方向 使用Div元素 Div元素用来在页面中定义一个区域，使用CSS样式控制Div元素的表现效果（关于CSS样式的内容，将在后面的章节中详细讲解），在Div元素中可以包含文本、图像、表格以及其他各种页面内容。在Dreamweaver CS3中，可以插入两种Div元素：一种为“Div标签”；另一种为AP Div。下面进行详细讲解。 插入Div标签 Div标签本身没有任何表现属性，如果要使Div标签显示某种效果，或者显示在某个位置，就要为Div标签定义CSS样式，插入Div标签的方法如下所示。 编辑Div标签 插入Div标签后，可以对Div标签进行各种操作，包括选择、剪切、复制和粘贴等。下面分别进行讲解。 1．选择Div标签 执行下列操作之一，选择Div标签。 编辑Div标签 2．剪切和复制Div标签 剪切和复制Div标签