css参考Word文件下载.docx
《css参考Word文件下载.docx》由会员分享，可在线阅读，更多相关《css参考Word文件下载.docx（30页珍藏版）》请在冰豆网上搜索。
本例演示如何垂直地重复背景图像。
如何在水平方向重复背景图像
本例演示如何水平地重复背景图像。
如何仅显示一次背景图像
本例演示如何仅显示一次背景图像。
如何放置背景图像
本例演示如何在页面上放置背景图像。
如何使用%来定位背景图像
本例演示如何使用百分比来在页面上定位背景图像。
如何使用像素来定位背景图像
本例演示如何使用像素来在页面上定位背景图像。
如何设置固定的背景图像
本例演示如何设置固定的背景图像。
图像不会随着页面的其他部分滚动。
所有背景属性在一个声明之中
本例演示如何使用简写属性来将所有背景属性设置在一个声明之中。
例子解释
CSS文本实例：
设置文本颜色
本例演示如何设置文本的颜色。
规定字符间距
本例演示如何增加或减少字符间距。
使用百分比设置行间距
本例演示如何使用百分比值来设置段落中的行间距。
使用像素值设置行间距
本例演示如何使用像素值来设置段落中的行间距。
使用数值来设置行间距
本例演示如何使用一个数值来设置段落中的行间距。
对齐文本
本例演示如何对齐文本。
修饰文本
本例演示如何向文本添加修饰。
缩进文本
本例演示如何缩进文本首行。
控制文本中的字母
本例演示如何控制文本中的字母。
在元素中禁止文本折行
本例演示如何禁止在元素中的文本折行。
增加单词间距
本例演示如何增加段落中单词间的距离。
CSS字体（font）实例：
设置文本的字体
本例演示如何设置文本字体。
设置字体尺寸
本例演示如何设置字体尺寸。
设置字体风格
本例演示如何设置字体风格。
设置字体的异体
本例演示如何设置字体的异体。
设置字体的粗细
本例演示如何设置字体的粗细。
所有字体属性在一个声明之内
本例演示如何使用简写属性将字体属性设置在一个声明之内。
CSS边框（border）实例：
所有边框属性在一个声明之中
本例演示用简写属性来将所有四个边框属性设置于同一声明中。
设置四边框样式
本例演示如何设置四边框样式。
设置每一边的不同边框
本例演示如何在元素的各边设置不同的边框。
所有边框宽度属性在一个声明之中
本例演示用简写属性来将所有边框宽度属性设置于同一声明中。
设置四个边框的颜色
本例演示如何设置四个边框的颜色。
可以设置一到四个颜色。
所有下边框属性在一个声明中
本例演示用简写属性来将所有下边框属性设置在同一声明中。
设置下边框的颜色
本例演示如何设置下边框的颜色。
设置下边框的样式
本例演示如何设置下边框的样式。
设置下边框的宽度
本例演示如何设置下边框的宽度。
所有左边框属性在一个声明之中
设置左边框的颜色
本例演示如何设置左边框的颜色。
设置左边框的样式
本例演示如何设置左边框的样式。
设置左边框的宽度
本例演示如何设置左边框的宽度。
所有右边框属性在一个声明之中
本例演示一个简写属性，用于把所有右边框属性设置在一条声明中。
设置右边框的颜色
本例演示如何设置右边框的颜色。
设置右边框的样式
本例演示如何设置右边框的样式。
设置右边框的宽度
本例演示如何设置右边框的宽度。
所有上边框属性在一个声明之中
本例演示用简写属性来将所有上边框属性设置于同一声明之中。
设置上边框的颜色
本例演示如何设置上边框的颜色。
设置上边框的样式
本例演示如何设置上边框的样式。
设置上边框的宽度
本例演示如何设置上边框的宽度。
CSS外边距（margin）实例：
设置文本的左外边距
本例演示如何设置文本的左外边距。
设置文本的右外边距
本例演示如何设置文本的右外边距。
设置文本的上外边距
本例演示如何设置文本的上外边距。
设置文本的下外边距
本例演示如何设置文本的下外边距。
所有的外边距属性在一个声明中。
本例演示如何将所有的外边距属性设置于一个声明中。
CSS内边距（padding）实例：
所有填充属性在一个声明中
本例演示使用简写属性将所有的填充属性设置于一个声明中，可以有一到四个值。
设置下内边距1
本例演示如何使用厘米值来设置单元格的下内边距。
设置下内边距2
本例演示如何使用百分比值来设置单元格的下内边距。
设置左内边距1
本例演示如何使用厘米值来设置单元格的左内边距。
设置左内边距2
本例演示如何使用百分比值来设置单元格的左内边距。
设置右内边距1
本例演示如何使用厘米值来设置单元格的右内边距。
设置右内边距2
本例演示如何使用百分比值来设置单元格的右内边距。
设置上内边距1
本例演示如何使用厘米值来设置单元格的上内边距。
设置上内边距2
本例演示如何使用百分比值来设置单元格的上内边距。
CSS列表实例：
在无序列表中的不同类型的列表标记
本例演示在CSS中不同类型的列表项标记。
在有序列表中不同类型的列表项标记
所有的列表样式类型
本例演示在CSS中所有不同类型的列表项标记。
将图像作为列表项标记
本例演示如何将图像作为列表项标记。
放置列表标记
本例演示在何处放置列表标记。
在一个声明中定义所有的列表属性
本例演示将所有针对列表的属性设置于一个简写属性。
CSS表格实例：
设置表格的布局
本例演示如何设置表格的布局。
显示表格中的空单元
本例演示是否显示表格中的空单元。
（请在非IE浏览器中浏览）
合并表格边框
本例演示是否把表格边框显示为一条单独的边框，还是像标准的HTML中那样分开显示。
设置表格边框之间的空白
本例演示如何设置单元格边框之间的距离。
设置表格标题的位置
本例演示如何定位表格的标题。
轮廓（Outlin）实例：
在元素周围画线
本例演示使用outline属性在元素周围画一条线。
设置轮廓的颜色
本例演示如何设置轮廓的颜色。
设置轮廓的样式
本例演示如何设置轮廓的样式。
设置轮廓的宽度
本例演示如何设置轮廓的宽度。
CSS尺寸（Dimension）实例：
使用像素值设置图像的高度
本例演示如何使用像素值设置元素的高度。
使用百分比设置图像的高度
本例演示如何使用百分比值来设置元素的高度。
使用像素值来设置元素的宽度
本例演示如何使用像素值来设置元素的宽度。
使用百分比来设置元素的宽度
本例演示如何使用百分比值来设置元素的宽度。
设置元素的最大高度
本例演示如何设置一个元素的最大高度。
使用像素值来设置元素的最大宽度
本例演示如何使用像素值来设置元素的最大高度。
使用百分比来设置元素的最大宽度
本例演示如何使用百分比值来设置元素的最大高度。
使用像素值来设置元素的最小高度
本例演示如何使用像素值来设置元素的最小高度。
使用像素值来设置元素的最小宽度
本例演示如何使用像素值来设置元素的最小宽度。
使用百分比来设置元素的最小宽度
本例演示如何使用百分比值来设置元素的最小宽度。
CSS分类（Classification）实例：
如何把元素显示为内联元素
本例演示如何把元素显示为内联元素。
如何把元素显示为块级元素
本例演示如何把元素显示为块级元素。
浮动属性的简单应用
使图像浮动于一个段落的右侧。
将带有边框和边界的图像浮动于段落的右侧
使图像浮动于段落的右侧。
向图像添加边框和边界。
带标题的图像浮动于右侧
使带有标题的图像浮动于右侧
使段落的首字母浮动于左侧
使段落的首字母浮动于左侧，并向这个字母添加样式。
创建水平菜单
使用具有一栏超链接的浮动来创建水平菜单。
创建无表格的首页
使用浮动来创建拥有页眉、页脚、左侧目录和主体内容的首页。
定位：
相对定位
本例演示如何相对于一个元素的正常位置来对其定位。
绝对定位
本例演示如何使用绝对值来对元素进行定位。
固定定位
本例演示如何相对于浏览器窗口来对元素进行定位。
如何使元素不可见
本例演示如何使元素不可见。
你希望元素被显示出来，还是不呢？
把表格元素设置为collapse（请在非IE的浏览器中查看）
本例演示如何使表格元素叠加？
改变光标
本例演示如何改变光标。
清除元素的侧面
本例演示如何使用清除元素侧面的浮动元素。
CSS定位（Positioning）实例：
设置元素的形状
本例演示如何设置元素的形状。
此元素被剪裁到这个形状内，并显示出来。
如何使用滚动条来显示元素内溢出的内容
本例演示当元素内容太大而超出规定区域时，如何设置溢出属性来规定相应的动作。
如何隐藏溢出元素中溢出的内容
本例演示在元素中的内容太大以至于无法适应指定的区域时，如何设置overflow属性来隐藏其内容。
如何设置浏览器来自动地处理溢出
本例演示如何设置浏览器来自动地处理溢出。
垂直排列图象
本例演示如何在文本中垂直排列图象。
Z-index
Z-index可被用于将在一个元素放置于另一元素之后。
上面的例子中的元素已经更改了Z-index。
使用固定值设置图像的上边缘
本例演示如何使用固定值设置图像的上边缘。
使用百分比设置图像的上边缘
本例演示如何使用百分比值设置图像的上边缘。
使用像素值设置图像的底部边缘
本例演示如何使用像素值设置图像的底部边缘。
使用百分比设置图像的底部边缘
本例演示如何使用百分比值设置图像的底部边缘。
使用固定值设置图像的左边缘
本例演示如何使用固定值设置图像的左边缘。
使用百分比设置图像的左边缘
本例演示如何使用百分比值设置图像的左边缘。
使用固定值设置图像的右边缘
本例演示如何使用固定值设置图像的右边缘。
使用百分比设置图像的右边缘
本例演示如何使用百分比值设置图像的右边缘。
CSS伪类（Pseudo-classes）实例：
超链接
本例演示如何向文档中的超链接添加不同的颜色。
超链接2
本例演示如何向超链接添加其他样式。
超链接：
:
focus的使用
本例演示如何使用:
focus伪类（无法在IE中工作）。
first-child（首个子对象）
本例演示:
first-child伪类的用法。
lang（语言）
lang伪类的用法。
CSS伪元素（Pseudo-elements）实例：
制作首字母特效
本例演示如何向文本的首字母添加特效。
制作首行特效
本例演示如何向文本的首行添加特效。
CSS参考手册
请点击表格中属性列的链接，可以查看相关属性的详细信息。
CSS属性组：
∙背景
∙文本
∙字体
∙边框和轮廓
∙外边距
∙内边距
∙列表
∙内容生成
∙尺寸
∙定位
∙打印
∙表格
∙伪类
∙伪元素
提示和注释：
属性：
“属性”列指向语法、实例、浏览器支持等内容。
CSS：
"
CSS"
列指示属性是在哪个CSS版本中定义的（CSS1还是CSS2）。
W3School的CSS参考手册定期在所有主流浏览器中进行测试。
最后测试时间：
2009年10月8日。
CSS背景属性（Background）
属性
描述
CSS
background
在一个声明中设置所有的背景属性。
1
background-attachment
设置背景图像是否固定或者随着页面的其余部分滚动。
background-color
设置元素的背景颜色。
background-image
设置元素的背景图像。
background-position
设置背景图像的开始位置。
background-repeat
设置是否及如何重复背景图像。
CSS边框属性（Border和Outline）
border
在一个声明中设置所有的边框属性。
border-bottom
在一个声明中设置所有的下边框属性。
border-bottom-color
设置下边框的颜色。
2
border-bottom-style
设置下边框的样式。
border-bottom-width
设置下边框的宽度。
border-color
设置四条边框的颜色。
border-left
在一个声明中设置所有的左边框属性。
border-left-color
设置左边框的颜色。
border-left-style
设置左边框的样式。
border-left-width
设置左边框的宽度。
border-right
在一个声明中设置所有的右边框属性。
border-right-color
设置右边框的颜色。
border-right-style
设置右边框的样式。
border-right-width
设置右边框的宽度。
border-style
设置四条边框的样式。
border-top
在一个声明中设置所有的上边框属性。
border-top-color
设置上边框的颜色。
border-top-style
设置上边框的样式。
border-top-width
设置上边框的宽度。
border-width
设置四条边框的宽度。
outline
在一个声明中设置所有的轮廓属性。
outline-color
设置轮廓的颜色。
outline-style
设置轮廓的样式。
outline-width
设置轮廓的宽度。
CSS文本属性（Text）
color
设置文本的颜色。
direction
规定文本的方向/书写方向。
letter-spacing
设置字符间距。
line-height
设置行高。
text-align
规定文本的水平对齐方式。
text-decoration
规定添加到文本的装饰效果。
text-indent
规定文本块首行的缩进。
text-shadow
规定添加到文本的阴影效果。
text-transform
控制文本的大小写。
unicode-bidi
设置文本方向。
white-space
规定如何处理元素中的空白。
word-spacing
设置单词间距。
CSS字体属性（Font）
font
在一个声明中设置所有字体属性。
font-family
规定文本的字体系列。
font-size
规定文本的字体尺寸。
font-size-adjust
为元素规定aspect值。
font-stretch
收缩或拉伸当前的字体系列。
font-style
规定文本的字体样式。
font-variant
font-weight
规定字体的粗细。
CSS外边距属性（Margin）
margin
在一个声明中设置所有外边距属性。
margin-bottom
设置元素的下外边距。
margin-left
设置元素的左外边距。
margin-right
设置元素的右外边距。
margin-top
设置元素的上外边距。
CSS内边距属性（Padding）
padding
在一个声明中设置所有内边距属性。
padding-bottom
设置元素的下内边距。
padding-left
设置元素的左内边距。
padding-right
设置元素的右内边距。
padding-top
设置元素的上内边距。
CSS列表属性（List）
list-style
在一个声明中设置所有的列表属性。
list-style-image
将图象设置为列表项标记。
list-style-position
设置列表项标记的放置位置。
list-style-type
设置列表项标记的类型。
marker-offset
内容生成（GeneratedContent）
content
与:
before以及:
after伪元素配合使用，来插入生成内容。
counter-increment
递增或递减一个或多个计数器。
counter-reset
创建或重置一个或多个计数器。
quotes
设置嵌套引用的引号类型。
CSS尺寸属性（Dimension）
height
设置元素高度。
max-height
设置元素的最大高度。
max-width
设置元素的最大宽度。
min-height
设置元素的最小高度。
min-width
设置元素的最小宽度。
width
设置元素的宽度。
CSS定位属性（Positioning）
bottom
设置定位元素下外边距边界与其包含块下边界之间的偏移。
clear
规定元素的哪一侧不允许其他浮动元素。
clip
剪裁绝对定位元素。
cursor
规定要显示的光标的类型（形状）。
display
规定元素应该生成的框的类型。
float
规定框是否应该浮动。
left
设置定位元素左外边距边界与其包含块左边界之间的偏移。
overflow
规定当内容溢出元素框时发生的事情。
position
规定元素的定位类型。
right
设置定位元素右外边距边界与其包含块右边界之间的偏移。
top
设置定位元素的上外边距边界与其包含块上边界之间的偏移。
vertical-align
设置元素的垂直对齐方式。
visibility
规定元素是否可见。
z-index
设置元素的堆叠顺序。
CSS打印属性（Print）
orphans
设置当元素内部发生分页时必须在页面底部保留的最少行数。
page-break-after
设置元素后的分页行为。
page-break-before
设置元素前的分页行为。
page-break-inside
设置元素内部的分页行为。
widows
设置当元素内部发生分页时必须在页面顶部保留的最少行数。
CSS表格属性（Table）
border-collapse
规定是否合并表格边框。
border-spacing
规定相邻单元格边框之间的距离。
caption-side
规定表格标题的位置。
empty-cells
规定是否显示表格中的空单元格上的边框和背景。
table-layout
设置用于表格的布局算法。
CSS伪类（Pseudo-classes）
active
向被激活的元素添加样式。
focus
向拥有键盘输入焦点的元素添加样式。
hover
当鼠标悬浮在元素上方时，向元素添加样式。
link
向未被访问的链接添加样式。
visited
向已被访问的链接添加样式。
first-child
向元素的第一个子元素添加样式。
lang
向带有指定lang属性的元素添加样式。
CSS伪元素（Pseudoelements）
first-letter
向文本的第一个字母添加特殊样式。
first-line
向文本的首行添加特殊样式。
before
在元素
升级会员 