《中文版Dreamweaver CS3网页制作实用教程》课件第7章

《《中文版Dreamweaver CS3网页制作实用教程》课件第7章》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、第7章使用CSS样式和插入行为精美的网页离不开CSS技术，使用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其他效果实现更加精确的控制。CSS样式的全名为CascadingStyleSheet，它可以定义HTML标签，按列表的语法将许多文字、图片、表格、表单、图层等设计加以格式设定。在HTML语法中，常常需要使用到一些设定颜色、字体大小或框线粗细之类的标签，而CSS在开始制作网页时就将这些设定做好，不需要在制作网页文档时再反复写入同样的标签。行为是以系列使用JavaScript程序预定义的页面特效工具，是

2、JavaScript在Dreamweaer中内置的程序库。利用行为，可以制作处各式各样的特素效果，例如播放声音、弹出菜单等。教学重点与难点绘制与编辑多线认识CSS样式创建CSS样式设置CSS样式认识行为插入行为7.1认识CSS样式CSS样式是CascadingStyleSheets(层叠样式单)的简称，也可以称为“级联样式表”，它是一种网页制作的新技术，利用它可以对网页中的文本进行精确的格式化控制。在CSS样式之前，HTML样式被广泛应用，HTML样式用于控制单个文档中某范围内文本的格式。而CSS样式与之不同，它

3、不仅可以控制单个文档中的多个范围内文本的格式，而且可以控制多个文档中文本的格式。要管理一个非常大的网站，使用CSS样式，可以快速格式化整个站点或多个文档中的字体、图像等网页元素的格式。并且，CSS样式可以实现多种不能用HTML样式实现的功能。CSS的基本概念CSS样式面板和常用类型创建CSS样式应用CSS样式7.1.1CSS的基本概念CSS，是用来控制一个网页文档中的某文本区域外观的一组格式属性。使用CSS能够简化网页代码，加快下载速度，减少上传的代码数量，从而可以避免重复操作。CSS样式表是对HTML语法的一次

4、重达革新，它位于文档的区，作用范围由CLASS或其他任何符合CSS规范的文本来设置。对于其他现有的文档，只要其中的CSS样式符合规范，Dreamweaver就能识别它们。7.1.2CSS样式面板和常用类型CSS常用的类型有外部样式表和内部样式表两种，要创建样式表，可以在“CSS样式”面板中创建。7.1.3创建CSS样式在DreamweaverCS3中，可以创建一个CSS样式，然后应用于文档的某个部分，完成文本的格式化。要创建CSS样式，可在文档编辑窗口中单击鼠标右键，在弹出的快捷菜单中选择“CSS样式

5、”

6、“新建”命令，如图所示，打开“新建CSS规则”对话框，如图所示。选择“CSS样式”

7、“新建”命令“CSS规则定义”对话框7.1.4应用CSS样式创建了CSS样式表后，就可以利用该样式表快速设置页面上的样式，使网站具有统一的风格了。在DreamweaverCS3环境下，对文档指定元素应用CSS样式可以在“属性”面板中设定、在标签处设定、在“标签检查器”面板组的“属性”面板中和右击文档选择快捷菜单设定。7.2管理CSS样式如果要对CSS样式进行编辑、删除、链接或者新建等操作，可以在“CSS样式”面板中找到相应的操

8、作按钮。链接和导入CSS样式编辑和删除CSS样式设置其他CSS样式CSS样式冲突7.2.1链接和导入CSS样式单击“CSS样式”面板中的“附加样式表”按钮，打开“链接外部样式表”对话框。单击对话框中的“浏览”按钮，打开“选择样式表文件”对话框，如图所示，在对话框中选择需要链接的外部CSS样式文件，然后单击“确定”按钮，将CSS样式文件倒入到“链接外部样式表”对话框种，选中“添加为”选项区域中的“链接”单选按钮，单击“确定”按钮，在“CSS样式”面板的列表中将显示链接的CSS文件。7.2.2编辑和删除CSS样式打开

9、“CSS样式”面板，选中要编辑的CSS样式，单击“编辑样式表”按钮，打开“CSS规则定义”对话框，可对在CSS面板中选中的CSS样式进行编辑，如图所示。7.2.3设置其他CSS样式除了设置CSS文本样式外，还可以设置“背景”、“区块”、“方框”、“边框”、“列表”、“定位”和“扩展”样式。7.2.4CSS样式冲突当相同的文本上应用两种或多种CSS样式时，可能会产生冲突，并导致不可预料的结果。浏览器显示样式格式依照以下规则。如果两种样式同时应用于相同文本，浏览器会将两种样式的所有格式都显示出来，除非样式格式发生冲突

10、。例如，一种样式指定文本的颜色为蓝色，另一样式则指定文本颜色为红色。如果应用于同一个文本的两种样式发生冲突，则浏览器会显示最内部的样式设置格式(即最靠近文本的样式)。如果存在直接冲突，则CSS样式(由class属性决定的样式)会覆盖基于HTML标记的样式格式。7.3认识行为行为是指在网页中进行的一系列动作，通过这些动作，可以实现用户同网页的交互，也可以通过动作使某个任务被