通过

级联样式表参考

  • 项目

Web 作者可通过使用级联样式表有效地控制文档的外观。

概述和教程

以下主题提供了有关如何创建级联样式表规则以及这些规则如何应用于 HTML 网页中的各个元素的概述信息：

  • 了解选择器   级联样式表的基本构建基块是其样式规则。选择器用于“选择”HTML 网页上的元素，以便可以设置其样式。如果没有选择器，则将无法确定应如何应用规则。本主题介绍级联样式表声明语法的基本原理，以说明如何使用选择器。

  • 长度单位参考   本节定义级联样式表支持的长度单位。

  • 关于元素定位   大多数现代的浏览器都能按 x 和 y 坐标定位 HTML 元素，并且在沿 z 轴的平面中重叠元素，从而在 Web 文档中产生靠近或远离查看者的效果。通过使用这些功能，您可以将元素、图像、控件或文本精确地放在网页上。通过使用脚本来操作位置坐标及其他动态样式，您可以在网页上移动元素，从而创建动态效果。动态样式、定位和透明图像的组合为您提供了一组丰富的动画选项。

  • 颜色   可通过两种方式在 HTML 网页上指定颜色：通过名称或通过 RGB 值。

  • 兼容模式下的度量属性和位置属性   动态 HTML (DHTML) 公开可用于更改网页上的 HTML 元素的大小和位置的度量和位置属性。如果了解这些属性及其对网页中的元素的影响，您将能够您更大程度地控制网页的外观。例如，您可以使用这些属性来设计类似于其他应用程序（例如 Microsoft Office PowerPoint 或 Microsoft Office Word）中的文档的网页。

属性

本节包含有关支持的级联样式表属性的参考主题。有关级联样式表属性的分类列表，请参阅按类别列出的属性。

  • background   设置对象的不同背景属性（最多五个）。

  • background-attachment   设置如何将背景图像附加到文档中的对象。

  • background-color   设置对象内容的背景颜色。

  • background-image   设置对象的背景图像。

  • background-position   设置对象的背景位置。

  • background-repeat   设置如何平铺对象的 background-image 属性。

  • border   设置要在对象周围绘制的属性。

  • border-collapse   设置一个值，以指示是在单个边框中连接表格的行和单元格边框，还是将它们分开（像在标准的 HTML 中一样）。

  • border-color   设置对象的边框颜色。

  • border-style   设置对象的左边框、右边框、上边框和下边框的样式。

  • border-left   设置对象的上边框的属性。

  • border-bottom-color   设置对象的下边框颜色。

  • border-left-color   设置对象的左边框颜色。

  • border-right-color   设置对象的右边框颜色。

  • border-top-color   设置对象的上边框颜色。

  • border-bottom-style   设置对象的下边框样式。

  • border-left-style   设置对象的左边框样式。

  • border-right-style   设置对象的右边框样式。

  • border-top-style   设置对象的上边框样式。

  • border-bottom-width   设置对象的下边框宽度。

  • border-left-width   设置对象的左边框宽度。

  • border-right-width   设置对象的右边框宽度。

  • border-top-width   设置对象的上边框宽度。

  • border-width   设置对象的左边框、右边框、上边框和下边框的宽度。

  • bottom   设置对象的底部位置（相对于文档层次结构中下一个定位对象的底部）。

  • clear   设置对象是否允许在其左侧和/或右侧出现浮动的对象，以便下一个对象显示在浮动的对象之后。

  • clip   设置定位对象的哪个部分可见。

  • color   设置对象的文本颜色。

  • cursor   设置在指针移到对象上时要显示的指针类型。

  • direction   设置对象的读取次序。

  • display   设置是否呈现对象。

  • font   设置对象的不同字体属性的组合。或者，设置或检索六种用户首选项字体中的一种或多种字体。

  • font-family   设置对象中的文本使用的字体的名称。

  • font-size   设置一个值，以指示对象中的文本使用的字号。

  • font-style   将对象的字体样式设置为倾斜 (italic)、正常或倾斜 (oblique)。

  • font-variant   设置对象的文本是否为小型大写字母。

  • font-weight   设置对象的字体粗细。

  • height   设置对象的高度。

  • left   设置对象的位置（相对于文档层次结构中下一个定位对象的左边缘）。

  • letter-spacing   设置对象中的字母之间的额外间距。

  • line-height   设置对象中的行距。

  • list-style 设置对象的多达三种单独的 list-style 属性。

  • list-style-image   设置一个值，以指示将哪个图像用作对象的列表项标记。

  • list-style-position 设置一个变量，以指示如何相对于对象的内容绘制列表项标记。

  • list-style-type   设置对象的行项标记的预定义类型。

  • margin 设置对象的上边距、右边距、下边距和左边距的宽度。

  • margin-bottom 设置对象的下边距大小。

  • margin-left 设置对象的左边距大小。

  • margin-right 设置对象的右边距大小。

  • margin-top 设置对象的上边距大小。

  • max-height   设置元素的最大高度。

  • max-width   设置元素的最大宽度。

  • min-height   设置元素的最小高度。

  • min-width   设置元素的最小宽度。

  • overflow 设置一个值，以指示在内容超出对象的高度或宽度时如何管理对象的内容。

  • padding 设置要在对象及其边距之间插入的间距；或者，如果有边框，则设置要在对象及其边框之间插入的间距。

  • padding-bottom 设置要在对象的下边框和内容之间插入的间距。

  • padding-left 设置要在对象的左边框和内容之间插入的间距。

  • padding-right 设置要在对象的右边框和内容之间插入的间距。

  • padding-top 设置要在对象的上边框和内容之间插入的间距。

  • page-break-after 设置一个值，以指示是否在对象后出现分页符。

  • page-break-before 设置一个值，以指示是否在对象前出现分页符。

  • position 设置用于对象的定位类型。

  • right 设置对象的位置（相对于文档层次结构中下一个定位对象的右边缘）。

  • table-layout 设置一个字符串，以指示是否固定表格布局。

  • text-align 设置对象中的文本是向左对齐、向右对齐、居中对齐还是两端对齐。

  • text-decoration 设置一个值，以指示对象中的文本是具有闪烁、贯穿线、上划线还是下划线效果。

  • text-indent 设置对象中的第一行文本的缩进。

  • text-transform 设置对象中的文本的呈现效果。

  • top 设置对象的位置（相对于文档层次结构中下一个定位对象的顶部）。

  • unicode-bidi 设置与双向（从右至左）算法相关的嵌入级别。

  • vertical-align 设置对象的垂直对齐方式。

  • visibility 设置是否显示对象的内容。

  • white-space 设置一个值，以指示是否在对象内自动换行。

  • width 设置对象的宽度。

  • word-spacing 设置对象中的字词之间的额外间距。

  • z-index 设置定位对象的堆叠顺序。