、、

、等等许多可以将它包围起来的元素。　　　　（2）格式化模型：格式化模型就是指如何定义这个容器内部及外部的一些属性值以及它们之间的相互关系。这里面包括核心的内容区域以及它周边的边距（margin）、边框（border）以及填充区域（padding），在后面我将会详细介绍这些属性的设定。我们可以仔细看看图（^46040702b^）以加深理解：　　#2　　4.单位　　　　样式表的另一个优势在于它可以精确的定义和控制元素的外观。　　　　（1）绝对单位：Web页上常用的绝对单位有厘米（cm）、毫米（mm）、英寸（in）、点（pt）、派克（pc）。绝对长度通常不能适应各种浏览器的多样性变化，因此应用得比较少。　　　　（2）相对单位：我们常用的单位是相对单位，所谓相对单位是指元素尺寸相对于浏览器的系统默认值来相应的缩放。包括：像素（px）、em和ex。Px是相对于浏览者的计算机屏幕分辨率来显示的，Windows用户一般使用96像素/英寸的分辨率，而Mac用户使用72像素/英寸分辨率。而em则是相对于当前对象中文本M的字体尺寸大小。如果当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认M字体尺寸。而ex是相对于当前对象中文本x的字体尺寸大小，如果当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认x字体尺寸。　　#1　　二、Dreamweaver样式表面板操作　　　　好了，上面讲了这么多样式表的基础概念和使用规则，下面我们来看看在Dreamweaver样式表面板中如何详细定义各个参数。进入样式表面板参数定义对话框后，我们可以看到左边一栏是样式表的属性分类。而右边是每一个分类里面的详细参数设置，下面我来分别介绍这几个分类，由于样式表的参数众多，我只介绍比较常用的参数。　　#2　　1.字体属性（Type）　　　　字体属性是每个页面中最基本的属性，需要注意的是，我们并不仅仅是对单独的文字定义字体属性，几乎所有得页面元素都会涉及到字体定义，如定义表格需要涉及表格中的字体、定义列表需要涉及列表中的字体、定义表单也会涉及到表单中的字体。字体属性面板中的参数比较好理解，它会涉及到我们上面介绍的字体长度单位。我简单介绍各个参数的意义。　　　　（1）Font：字体字型文件，对于中文，最好只使用系统自带的四种字体，常用宋体。　　　　（2）Size：字体大小。通常我们用12Px大小的。　　　　（3）Style：字体的修饰，包括正常和斜体。　　　　（4）Line：字体的行间距，我们选用1.5ems是代表行距为字体大小的1.5倍。　　　　（5）Decoration：设置对象中文本的装饰，分别有下划线、上划线、删除线、闪烁。　　　　（6）Color：字体颜色。　　#2　　2.背景属性（Background）　　　　背景的属性通常包括背景色和背景图片，在样式表中Color通常指的是前景的颜色，更多时候也就是字体的颜色，而Background是指背景的颜色。在这个对话框离我们可以精确设定背景图片的位置、是否重复显示、是否随页面内容滚动。　　　　（1）Repeat：设定背景是否重复以及可以沿着特定方向重复。　　　　（2）Attachment：设定背景图片可以固定或随着内容而自动滚动。　　　　（3）Horizontal/Vertical设定背景图片的偏移值。　　#2　　3.文本块属性（Block）　　　　文本块属性主要是定义段落的一些属性值，需要注意的是在Dreamweaver样式面板里很多属性前面有“*”，这表示此属性只能在浏览器中看到效果，在Dreamweaver的编辑其中无法预览，如图（^46040702c^）所示。　　　　（1）Word Spacing：这是定义各个单词之间的额外间距，对中文格式无效。　　　　（2）Letter Spacing：定义每个字符之间的额外间距，对中文同样有效。　　　　（3）Vertical Alignment：垂直对齐方式。　　　　（4）Text Align：水平对齐方式。　　　　（5）Text Indent：这是段落首行缩进的距离，通常我们定义2ems，及两个中文字的距离。　　　　（6）Whitespace：设置或检索对象内空格的处理方式。　　#2　　4.容器属性（Box）　　　　这是样式表最为重要的一个属性类别，是实现页面元素精确定位的基础。　　　　（1）Width/Height：宽和高。实现容器概念的基础，只有定义了其中的一个值，才能使元素具有容器的空间。　　　　（2）Padding：填充距，决定了容器边框和容器内部的内容之间的距离。　　　　（3）Margin：边距，设置容器中的元素和周围的元素之间的距离。　　　　（4）Float：使元素悬浮在页面上，可以使周围的文字围绕在此元素周围，类似于图文混排的概念，但是在CSS中任何元素都可以像图片一样实现悬浮。　　　　（5）Clear：这个属性是配合上面的浮动属性，它可以决定浮动属性是否可以出现在指定的容器一边，例如设定Left表示浮动元素不可以出现在容器的左边。　　#2　　5.边框属性（Border）　　　　此属性是容器概念中的重要内容，可以设定容器四边的边框宽度数值、颜色及边框样式，如图（^46040702d^）所示。　　　　（1）Width：可以精确指定边框的数值，要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。　　　　（2）Color：可以为每一个边框单独设定色彩。　　　　（3）Style：设定边框的外观样式，需要注意有些样式只有在IE5.5以上浏览器中才可以看到效果，如图（^46040702e^）所示。　　#2　　6.列表属性（List）　　　　列表属性可以对分级列表内容进行更多的控制。　　　　（1）Type：设定列表显示的项目符号或编号的类型。　　　　（2）Bullet：可以为列表指定一个单独的图片作为标志，例如一个三角形的箭头。　　　　（3）Position：设定列表容器中的内容显示位置。　　#2　　7.定位属性（Position）　　　　定位属性是实现精确和自由定位的关键属性，它给了设计者更大的控制页面元素的能力，而且还扩展到了三维的z轴方向，从而为动态页面的实现创造了基础，如图（^46040702f^）所示。　　　　（1）Type：定位属性的基本类型有相对定位和绝对定位，相对定位使元素倚赖页面元素的原始位置进行偏移，而绝对定位使元素脱离原始元素的束缚，实现自由偏移定位，绝对定位的元素与父级元素的位置无关。　　　　（2）Z-Index：当两个绝对定位的元素位置有相同的，则依赖此属性确定哪个元素遮挡另一个元素。　　　　（3）Placement：这里面的属性定义了容器的具体大小以及与已有的父级元素的距离。　　　　（4）Clip：设置对象的可视区域，所设定区域之外的内容将被剪切隐藏。必须将position的值设为absolute，此属性方可使用。　　　　（5）Visibility：决定元素的显示状态是可见还是不可见。　　#2　　8.扩充属性　　　　这个对话框中的属性是一些增强性的样式属性，在低版本和不同类型的浏览器支持不好。　　　　（1）Page Break：设定打印时页面分页的位置。　　　　（2）Cursor：用来设定鼠标通过对像位置时显示何种系统内置光标外形。　　　　（3）Filter：使用这里的设置可以将一些特定的滤镜和转换效果添加到一个容器中的元素上。　　　　