网页设计与制作教学资料 项目7 CSS样式表的应用.pptVIP

CSS样式就像word中的格式刷,可以对众多网页中的文本及文本区外观进行统一控制。 样式表的概念 样式表是为了弥补HTML语言而开发，调整字间距、行间距、取消链接的下划线、固定背景图像等样式表可以实现原来的HTML标记无法实现的效果。 样式表的优点 内容结构和格式控制相分离 精确控制网页外观 制作体积下，下载页面快 快速规格网页样式 兼容不同浏览器;;;;;使用CSS编辑器可以创建、编辑和删除CSS样式。并且可以将外部样式表文件附加到当前文档。 “附加样式表”：单击该按钮会打开“链接外部样式表”对话框，可选择要链接到或导入到当前文档中的外部样式表。 “新建CSS规则”：打开“新建CSS样式”对话框，可以选择创建的样式类型。如类样式、标签样式或高级样式。 “编辑样式”：打开“CSS样式定义”对话框，可编辑当前文档或外部样式表中的样式。 ??删除CSS规则”：删除“CSS样式”面板的所选样式，并从应用该样式的所有元素中删除格式，但是不删除对该样式的引用。;;;管理CSS样式 修改例2中创建的.style2样式。将样式名称改为.biaoti,字体设置为新宋体，字号设置为36像素,颜色设置为#339966。 内部样式表和外部样式表 内部样式表是将CSS样式的定义直接写在HTML文档Head部分的Style标签内，仅供该网页使用。外部样式表是一系列存储在一个单独的外部文件（ .css 文件，并非HTML文件）中的CSS样式。利用文档head部分中的链接，该文件被链接到Web站点中的一页或多页上。 ;;;;;类型面板 主要用于定义网页中文本的字体、颜色及字体的风格等. 例6:为指定页面设置文字样式。要求是新宋体，12像素细体字，行间距有30像素，颜色#6699FF。 ① 打开指定的页面。 ② 打开CSS样式面板，单击“新建CSS规则”按钮，打开“新建CSS规则”对话框，在“名称”文本框中输入“.wz”，然后单击“确定”按钮。 ③ 打开定义样式对话框，在对话框左侧的“分类”列表中选择“类型”后，在右侧的类型属性面板中设置“字体”为“新宋体”，“大小”设置为“12像素”，“粗细”设置为“细体”，“行高”设置为“30像素”，“颜色”设置为“#6699FF”。 ④ 单击“确定”按钮，选取页面中的文字，在属性面板中选择“样式”下拉列表中的“wz”选项。保存文件，按F12键预览 。 ;;;;;;