《网络技术基础——Internet和网页设计教学课件作者第二版童欣第109章Frontpage》由会员分享，可在线阅读，更多相关《网络技术基础——Internet和网页设计教学课件作者第二版童欣第109章Frontpage（26页珍藏版）》请在金锄头文库上搜索。
1、10.9 网页样式表,在编辑网页的过程中，为了使文本的风格在各个网页中保持一致，通常使用样式。样式是控制文本块或段落外观的一组格式属性。使用样式表的目的不仅是让它们具有相同的外观，也是为了修改和编辑方便。如果要修改文本的外观，只要修改样式，凡应用了样式的文本就都被修改了。,10.9 网页样式表,1创建网页样式 一般情况下，编辑文本时，如果没有使用样式的话，都是在普通样式下编辑的文本，即样式工具按钮栏中显示的是 。单击普通右侧的下拉箭头，可看到在下拉列表中，系统已经提供的一些样式。除此之外，用户还能创建自己的样式。,10.9.1 网页样式, 单击“格式”菜单下的“样式”命令，弹出“样式”对话框。
2、,10.9.1 网页样式, 在该对话框中，单击“新建”按钮，弹出“新样式”对话框。在“名称（选择器）”输入框中输入新建样式的名称，如font1。单击“格式”按钮，从弹出的菜单中可看到字体、段落、边框、编号方式和定位选项。,10.9.1 网页样式,字体： 用来定义文本的字体、颜色、字型、字号、效果及字符间距等。,10.9.1 网页样式,段落： 用来定义段落的对齐方式、缩进等。,10.9.1 网页样式,边框： 用来定义边框、背景等。,10.9.1 网页样式,编号方式： 用来定义项目列表的符号、编号等样式。,10.9.1 网页样式,定位： 用来定义文本饶图片的环绕方式，,10.9.1 网页样式, 根
3、据需要选择要定义样式的各个内容。例如设置一个名为font1的文本样式，各属性设置如图所示。单击“确定”按钮，样式设置好后了。,10.9.1 网页样式, 单击“确定”按钮，样式设置好后了。单击“格式”工具栏中的“样式”右侧的箭头，可看到font1已经添加到样式列表中，,10.9.1 网页样式,10.9.1 网页样式,2应用样式 样式创建好后，就要在网页元素中应用样式了。应用样式的方法很简单：将光标定位在要应用样式的文本中，或选中要应用样式的网页元素，单击样式表中的样式即可。,10.9.1 网页样式,例如：将图中的文本应用样式。,10.9.1 网页样式, 选中要使用样式的文本，单击样式下拉列表中的
4、“font1”，文本就被设置成font1定义的格式。 将标题应用 “标题1”的样式。如图所示。,10.9.1 网页样式,3修改样式 打开“样式”对话框，在“样式”列表框中，选择要修改的用户创建的样式，单击“修改”按钮，即可对样式重新定义。 4删除样式 打开“样式”对话框，在“样式”列表框中，选择要删除的用户创建的样式，单击“删除”按钮，样式就被删除了。,10.9.2 外部样式表,用上述方法创建的样式，只能在创建样式的文件中使用，而不能被其它文件所使用，这种样式在应用上受到了很大的限制，要使样式能被站点中其它文件使用，就需要创建外部样式，当在站点的网页链接到外部样式时，该外部样式就被链接到网页中
5、的样式列表中了。,10.9.2 外部样式表,1创建外部样式 外部样式其实是一种后缀为.css的级联样式表文件。创建外部样式，就是创建一个这样的样式文件。 单击“文件”菜单下“新建”命令，在“新建”任务窗格中的“新建网页”选项中，选择“其他网页摸板” ，打开“网页摸板”对话框。单击“样式表”标签，切换到“样式表”选项卡，,10.9.2 外部样式表,在“样式表”选项卡中，选择一种要创建的样式类型，如创建一个“普通”样式表。单击“确定”按钮，,10.9.2 外部样式表,进入编辑样式界面，系统弹出“样式”工具栏，单击“样式”工具按钮 ，弹出“样式”对话框，定义样式的字体、段落等。创建的过程同上节相同。
6、,10.9.2 外部样式表,样式创建好后，单击“样式”对话框中的“确定”按钮，回到编辑样式窗口。这时可看到该级联样式的HTML标记符。,10.9.2 外部样式表,单击“文件”菜单下的“保存”命令，在“另存为”对话框中，输入要保存的样式的文件名，确定要保存样式的位置，单击“保存”按钮，该样式文件就被保存指定的位置上了。,10.9.2 外部样式表,2使用外部样式 使用外部级联样式表的方法是： 打开要使用外部样式的网页。 单击“格式”菜单下的“样式表链接”命令，打开“链接样式表”对话框。,10.9.2 外部样式表,单击“添加”按钮，弹出“选择样式表”对话框。选择要链接的样式文件。,10.9.2 外部
7、样式表,单击“确定”按钮，返回到“链接样式表”，并在URL的列表框中出现了选择的样式文件，单击“确定”按钮。回到要使用样式的网页。 单击“样式”列表的下拉箭头，可见，外部级联样式文件已加到列表中，用户可以使用了。,10.9.2 外部样式表,3修改外部样式 修改外部样式的方法是： 在“文件夹列表”中或“文件夹”视图下，双击外部样式文件名，即可打开样式编辑窗口，单击“样式”工具按钮，弹出“样式”对话框，重新编辑样式。 4删除外部样式 删除外部样式文件同删除站点中的其它文件一样。最简单的一种方法是：在“文件夹列表”中或“文件夹”视图下，鼠标右键单击外部样式文件名，在弹出的快捷菜单中，选择“删除”命令，即可删除外部样式文件。,
