创建和管理CSS样式.pptxVIP

创建和管理CSS样式网页设计与制作 　创建和管理CSS样式1.1　使用“CSS规则定义”对话框管理样式创建CSS样式使用“CSS规则定义”对话框新建CSS样式的步骤　　①在Dreamweaver CS4的设计模式下，将光标定位到需要使用CSS样式的段落中。在“属性选择器”中选择单击“CSS”按钮，切换到“属性选择器”的CSS界面。　　②在“目标规则”下拉列表中选择“新CSS规则”，然后单击“编辑规则”按钮，弹出如图所示的“新建CSS规则”对话框。 　创建和管理CSS样式1.1　使用“CSS规则定义”对话框管理样式创建CSS样式使用“CSS规则定义”对话框新建CSS样式的步骤　　③“选择器类型”下拉列表中选择“类（可应用于任何HTML元素）”选择器，在“选择器名称”对话框中输入类选择器的名称“txt1”，在“规则定义”下拉列表中选择“仅限于该文档”，然后单击“确定”按钮，弹出如图所示的“.txt1的CSS规则定义”对话框。 　创建和管理CSS样式1.1　使用“CSS规则定义”对话框管理样式创建CSS样式使用“CSS规则定义”对话框新建CSS样式的步骤　　④在“.txt1的CSS规则定义”对话框左边“分类”栏中选择“类型”选项，在该对话框中设置需要的文本CSS规则后，单击“确定”按钮，即可得到如图所示的CSS代码，并将新建的规则应用到指定的位置。 　创建和管理CSS样式1.1　使用“CSS规则定义”对话框管理样式　　使用“CSS规则定义”对话框编辑样式表的步骤如下。　　①在Dreamweaver CS4的设计模式下，在HTML文档中单击鼠标。在“属性选择器”中选择单击“CSS”按钮，切换到“属性选择器”的CSS界面。　　②在“目标规则”下拉列表中选择需要修改的CSS样式的选择器名称，比如“.txt2”，然后单击“编辑规则”按钮，弹出“.txt1的CSS规则定义”对话框。　　③在“.txt2的CSS规则定义”对话框重新设置CSS规则后，单击“确定”按钮，即可将修改后的规则应用到指定的位置。使用“CSS规则定义”对话框编辑样式 　创建和管理CSS样式1.2　通过CSS样式面板管理样式　　 欲使用“CSS样式”面板新建CSS样式表，首先在Dreamweaver CS4中，打开HTML文档，然后按照下面的步骤操作。 ①将光标定位在需要使用新建的CSS样式表的段落，然后选择菜单命令“窗口”→“CSS样式”，打开“CSS样式”面板。 ②单击“新建CSS规则”按钮，弹出如图所示的“新建CSS规则”对话框。新建内部CSS样式表 　创建和管理CSS样式1.2　通过CSS样式面板管理样式　　③“选择器类型”下拉列表中选择“类（可应用于任何HTML元素）”选择器，在“选择器名称”对话框中输入类选择器的名称“txt3”，在“规则定义”下拉列表中选择“仅限于该文档”，然后单击“确定”按钮，弹出“.txt3的CSS规则定义”对话框。 ④设置完成需要的CSS样式规则后，单击“确定”按钮，即可在“CSS样式”面板的“所有规则”列表中显示该新建的CSS样式，也会立即将该CSS样式应用到指定的文档中。新建内部CSS样式表 　创建和管理CSS样式1.2　通过CSS样式面板管理样式　　①选择菜单命令“窗口”→“CSS样式”弹出“CSS样式”面板。 ②单击“CSS样式”面板右下角的“附加样式表”按钮，弹出如图所示的“链接外部样式表”对话框。创建附加样式表 　创建和管理CSS样式1.2　通过CSS样式面板管理样式　　③在“文件/URL”下拉列表中输入需要新建的附加样式表文件的名称，或单击“浏览”按钮，在弹出的 “选择样式表文件”对话框中输入新建的附加样式表文件的名称，如“mymain.css”，然后单击确定按钮返回“链接外部样式表”对话框。 ④在“添加为”单选按钮组中选择需要的附加样式文件的导入方式，这里选择“链接”。在“媒体”下拉列表中选择“all”后，单击“确定”按钮，完成新建操作，此时，在“CSS样式”面板的“所有规则”列表中会列出该样式文件。创建附加样式表 　创建和管理CSS样式1.2　通过CSS样式面板管理样式　　在“CSS样式”面板中编辑CSS样式的步骤如下。 ①在“CSS样式”面板的“所有规则”列表中选择需要编辑的样式的名称。 ②单击“编辑样式...”按钮，即可弹出如图所示的“.txt3的CSS规则定义”对话框。 ③编辑完成需要的CSS样式规则后，单击“确定”按钮，即可立即将修改后的CSS样式应用到指定的文档中。编辑样式 　创建和管理CSS样式1.3　使用菜单创建外部CSS样式　　在Dreamweaver CS4中除了可以通过“CSS样式