第六章利用CSS样式表美化网页分解.pptVIP

二、文本属性 二、文本属性 （一）文本编辑效果 1.font-family 2.font-size 3.color 4.font-style 5.font-weight 6.font-decoration 7.font-transform 8.font-variant （二）文本位置控制 1.缩进文本 2.水平对齐 3.字间距 三、列表 三、列表 （一）列表符号 列表属性用来修改列表的符号外观，它的值有： disc、 circle、square、 decimal、 lower-roman、 upper-roman、 lower-alpha、 none：无列表项标签。 （二）列表位置 列表位置属性list-style-position用于控制列表的位置，该属性有两个值：outside表示以列表项内容为准对齐；inside表示以列表项标签为准对齐。 （三）列表图片 有的时候为了使列表更加突出，可以使用list-style-image属性将自定义的图片作为列表的符号。 四、定位 四、定位 （1）relative（相对）：不脱离文档内容，参考自身静态位置通过top、bottom、left和right定位，并且可以通过z-index进行层次分级。 （2）absolute（绝对）：脱离文档内容，通过top、bottom、left和right定位。选取其最近的父级定位元素，当父级 定义为 static 时，absolute元素将以body坐标原点进行定位，可以通过z-index进行层次分级。 （3）static（静态）：没有特别的设定，遵循基本的定位规定，不能通过z-index进行层次分级。 （4）fixed（固定）：这里所固定的对象是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。 五、浮动 五、浮动 （一）左对齐 当为一个元素设置浮动方式为左对齐后，该元素将向左移动。 （二）右对齐 当为一个元素设置浮动方式为左对齐后，该元素将向右移动。 浮动（float）也是元素定位的一种方式，在HTML中任何元素都可以被浮动。段落、div、list、tables以及图像等，但被浮动的元素必须是块级元素，如不是块级元素可以通过添加display: block;将元素显示为块级元素。 六、滤镜 六、滤镜 CSS滤镜用于为页面中的可见元素添加一些特殊的效果。在HTML中添加滤镜效果的CSS样式代码如下： style=filter:filtername(fparameter1,fparameter2…) 其中，filtername为滤镜的名称，fparameter1、fparameter2等是该滤镜的参数。它共有11种常用滤镜。 第五节 CSS面板的应用 一、CSS样式面板简介 一、CSS样式面板简介 单击“窗口”→“CSS样式”命令，或是按Shift+F11组合键，即可打开“CSS样式”面板，其显示如下： 二 新建样式表规则 二 、新建样式表规则 如果要创建内部样式表，操作步骤如下： （1）执行“窗口”→“CSS样式”命令，打开“CSS样式”对话框。 （2）执行“新建样式表”按钮，弹出“新建CSS规则”对话框，如图所示。 （一）选择器类型 用于定义要创建的CSS样式的类型。 （二）选择器名称 在“选择器名称”文本框中输入样式的名称。 （三）规则定义 用于选择CSS规则定义的位置，是直接应用于当前HTML文档中，还是要附加到外部的CSS文件中。 三、设置CSS属性 三、设置CSS属性 使用“CSS规则定义”对话框是用于定义CSS规则的属性，如文本字体、背景图像和颜色、间距和布局属性以及列表元素外观。它主要可设置下列属性。 （一）类型 中的“类型”类别可以定义CSS样式的基本字体和类型设置。“类型”类别规则如图。 三、设置CSS属性 （二）背景 使用“CSS 规则定义”对话框的“背景”类别可以定义CSS样式的背景设置。可以对网页中的任何元素应用背景属性。 三、设置CSS属性 （三）区块 使用“CSS 规则定义”对话框的“区块”类别可以定义标签和属性的间距和对齐设置。主要用于对段落、列表等文本块的设置。 三、设置CSS属性 （四）方框 所谓方框，在现行的Web标准中定义为，成对的HTML标签就构成为了块，即是用于放置内容的容器。 三、设置CSS属性 （五）边框 使用“CSS 规则定义”对话框的“边框”类别可以定义元素周围的边框的设置（如宽度、颜色和样式）。 三、设置CSS属性 （六）列表 “CSS 规则定义”对话框的“列表”类别为列表标签定义列表设置（如项目符号大小和类型）。 三、设置CSS属性 （七）定位 “定位”样式属性确定与选定的CSS样式相关的内容在页面上的定位方式。 三、设置CSS属性 （八）扩展 “扩展”样式属性