6-APDiv布局网页CSS美化网页.pptxVIP

;;本章导读;5.1.1 AP Div的创建;在Dreamweaver CS6中创建AP Div的方法很简单，既可直接通过菜单栏进行插入，也可通过“布局”选项卡进行绘制。 ;5.1.1.2 创建嵌套AP Div;5.1.2 AP Div的编辑操作;在Dreamweaver CS6中可选择【窗口】/【AP Div】命令或按F2键打开“AP 元素”面板。在其中查看当前网页中包含的所有AP Div。;5.1.2.2 选择AP Div;选择需移动的AP Div后，将鼠标光标移到AP Div边框上，当鼠标光标变为 形状时，按住鼠标左键不放进行拖动，到需要的位置后释放鼠标即可。;在网页制作过程中常需要将AP Div进行对齐。AP Div的对齐方式有左对齐、右对齐、上对齐和对齐下缘。在进行对齐的过程中，Dreamweaver CS6会默认以最后选择的AP Div为标准进行对齐。;在网页制作过程中，常常需要对创建的AP Div大小进行调整，使其符合网页的要求。;5.1.2.6 设置AP Div的堆叠顺序;选择需改变堆叠顺序的AP Div后，在“属性”面板中的“Z轴”文本框中输入所需的数值，大于原数字可将该AP Div在堆叠顺序中上移，小于原数字可将该AP Div在堆叠顺序中下移，完成输入后按Enter键确认即可。;打开“AP 元素”面板，在Z栏中双击需要进行修改的AP Div对应的Z轴值，修改后在空白处单击鼠标即可。;选择需更改堆叠顺序的AP Div后，选择【修改】/【排列顺序】命令，在弹出的子菜单中选择“移到最上层”或“移到最下层”命令即可。;5.1.2.7 改变AP Div的可见性;选择要设置可见性的AP Div后，在其上单击鼠标右键，在弹出的快捷菜单中选择【可视性】/【隐藏】命令，再在编辑窗口的空白区域单击鼠标左键即可隐藏AP Div。;如果要显示隐藏的AP Div，则需要在“AP 元素”面板中选择隐藏的AP Div，再在选中的AP Div上单击鼠标右键，在弹出的快捷菜单中选择“可视”命令即可，再在编辑窗口的空白区域单击鼠标左键即可显示AP Div。;学电脑从入门到精通;5.1.3.1 单个AP Div的属性设置;如果多个AP Div具有相同的属性需要设置，则可同时选择这些AP Div，然后再在“属性”面板中进行设置。;5.1.4 提高实例——制作西餐厅网页;5.1.4.1 行业分析;5.1.4.2 操作思路;5.1.5 提高练习——制作服装展示网页;5.1.6 知识问答;知识关联：使用CSS美化网页;导读-ξ5.2、使用CSS美化网页;5.2.1 认识层叠样式表;5.2.2 创建层叠样式表;选择“窗口/CSS样式”命令或按Shift＋F11键可打开“CSS样式”面板。在其中显示了当前网页中存在的所有CSS样式，包括外部链接样式表和内部样式表。 ;5.2.2.2 创建层叠样式表;1）．认识层CSS样式的类型;该样式可用于HTML中的任何元素，定义该类型的CSS样式时，需在其名称前加上“.”符号。Dreamweaver CS6会为该类型的CSS样式的HTML代码中添加class属性。;该样式只能应用于惟一的标签，且这个标签的ID必须是惟一的，ID类型的CSS样式，其名称前应添加“#”符号。;该样式用于重新定义HTML元素，只需新建该类型的CSS样式后，即可直接将其应用到网页中。 ;该样式用于在已创建的CSS样式基础上，创建或改变一个或多个标签、类或ID的复合规则样式表，使包含在该标签中的内容遵循定义的CSS规则进行显示。;内部CSS样式是指存放在网页代码中，并非以单独的层叠样式表文件而存在的形式。在Dreamweaver CS6中可以直接在“CSS样式”面板中新建任一类型的内部层叠样式，新建后的样式存放在HTML文件的头部，即head与 /head标签内，并以style开始，/style结束。;在Dreamweaver CS6中可以链接已经创建好的CSS文件，使其应用到网页中。;5.2.3 定义层叠样式表属性;CSS的“类型”属性主要用于设置文本的样式和格式，只要在CSS规则定义对话框的“分类”列表框中选择“类型”选项，即可在对话框右侧进行设置。;“背景”属性可以对网页的背景样式进行设置，只要在CSS规则定义对话框的“分类”列表框中选择“背景”选项，即可在对话框右侧对其进行设置。;在CSS规则定义对话框的“分类”列表框中选择“区块”选项，在对话框右侧可对区块的样式进行设置。;在CSS规则定义对话框的“分类”列表框中选择“方框”选项，在对话框右侧可对方框的样式进行设置。;在CSS规则定义对话框的“分类”列表框中选择“边框”选项，在对话框右侧可对边框的样式进行设置。;在CSS规则定义对话框的“分类”列表框中选