css参考手册(完美整理版)

合集下载

CSS选择器参考手册

目录CSS 选择器参考手册........................................... 错误!未定义书签。

CSS .class 选择器................................................. 错误!未定义书签。

CSS #id 选择器..................................................... 错误!未定义书签。

CSS *选择器......................................................... 错误!未定义书签。

CSS element选择器........................................... 错误!未定义书签。

CSS element,element选择器.......................... 错误!未定义书签。

CSS element element选择器........................ 错误!未定义书签。

CSS element>element 选择器........................ 错误!未定义书签。

CSS element+element选择器........................ 错误!未定义书签。

CSS [attribute] 选择器....................................... 错误!未定义书签。

CSS :visited 选择器............................................. 错误!未定义书签。

CSS :active 选择器.............................................. 错误!未定义书签。

css参考手册(完美整理版)

CSS 背景属性（Background）属性描述CSS background在一个声明中设置所有的背景属性。

1 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。

1 background-color设置元素的背景颜色。

1 background-image设置元素的背景图像。

1 background-position设置背景图像的开始位置。

1 background-repeat设置是否及如何重复背景图像。

1CSS 边框属性（Border 和Outline）属性描述CSS border在一个声明中设置所有的边框属性。

1 border-bottom在一个声明中设置所有的下边框属性。

1 border-bottom-color设置下边框的颜色。

2 border-bottom-style设置下边框的样式。

2 border-bottom-width设置下边框的宽度。

1 border-color设置四条边框的颜色。

1 border-left在一个声明中设置所有的左边框属性。

1 border-left-color设置左边框的颜色。

2 border-left-style设置左边框的样式。

2 border-left-width设置左边框的宽度。

1 border-right在一个声明中设置所有的右边框属性。

1 border-right-color设置右边框的颜色。

2 border-right-style设置右边框的样式。

2 border-right-width设置右边框的宽度。

1 border-style设置四条边框的样式。

1 border-top在一个声明中设置所有的上边框属性。

1 border-top-color设置上边框的颜色。

2 border-top-style设置上边框的样式。

2 border-top-width设置上边框的宽度。

《属参考手册》word版

CSS参考手册1.CSS背景属性（Background）2.CSS文本属性（Text）3.CSS字体属性（Font）4.CSS边框和轮廓属性（Border和Outline）5.CSS外边距属性（Margin）6.CSS内边距属性（Padding）7.CSS列表属性（List）8.内容生成（Generated Content）9.CSS尺寸属性（Dimension）10.CSS定位属性（Positioning）11.CSS打印属性（Print）12.CSS表格属性（Table）13.CSS伪类（Pseudo-classes）14.伪元素1.CSS背景属性(1)background属性background 简写属性在一个声明中设置所有的背景属性。

可以按顺序设置如下属性：background-color , background-image , background-repeat , background-attachment , background-position。

如果不设置其中的某个值，也不会出问题。

通常建议使用这个属性，而不是分别使用单个属性，因为这个属性在较老的浏览器中能够得到更好的支持，而且需要键入的字母也更少。

可能的值：(2)background-attachment属性background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动。

可能的值：支持属性值"inherit"。

(3)background-color属性background-color 属性设置元素的背景颜色。

background-color 属性为元素设置一种纯色。

这种颜色会填充元素的内容、内边距和边框区域，扩展到元素边框的外边界（但不包括外边距）。

如果边框有透明部分（如虚线边框），会透过这些透明部分显示出背景色。

可能的值：性值"inherit"。

(4)background-image属性background-image 属性为元素设置背景图像。

css3 手册所有

css3 手册所有一、引言CSS（层叠样式表）是一种用于描述文档样式的标记语言，具体包括字体、颜色、布局等方面的样式定义。

CSS3是CSS的最新版本，是Web开发中常用的样式定义语言之一。

本手册将详细介绍CSS3的各项属性及其使用方法。

二、选择器1. 元素选择器元素选择器是CSS中最常用的选择器之一，通过元素名称来选择文档中的元素。

例如，使用`p`选择器可以选择所有的`<p>`标签。

2. 类选择器类选择器用于选择带有特定类名的元素。

通过在类名前面加上点号（.），例如`.red`，可以选择具有`red`类的元素。

3. ID选择器ID选择器用于选择具有特定ID的元素。

通过在ID名称前面加上井号（#），例如`#header`，可以选择具有`header`的ID的元素。

4. 属性选择器属性选择器用于选择具有特定属性值的元素。

通过在属性名前加上方括号（[]），例如`[type="text"]`，可以选择type属性值为"text"的元素。

5. 伪类选择器伪类选择器用于选择元素的特殊状态。

常见的伪类选择器有`hover`、`active`和`visited`等。

6. 伪元素选择器伪元素选择器用于在文档中添加不存在的元素并为其添加样式。

常见的伪元素选择器有`::before`和`::after`等。

三、文本样式1. 字体可以使用`font-family`属性设置元素的字体。

例如，`font-family: Arial, sans-serif;`可以设置字体为Arial。

2. 颜色可以使用`color`属性设置元素的文本颜色。

例如，`color: red;`可以将文本颜色设置为红色。

3. 背景可以使用`background-color`属性设置元素的背景颜色。

例如，`background-color: #f1f1f1;`可以将背景颜色设置为浅灰色。

四、盒子模型1. 尺寸可以使用`width`和`height`属性设置元素的宽度和高度。

CSS3.0参考手册

示例：
使用的图片:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="utf-8" /> <meta name="robots" content="all" /> <meta name="author" content="Tencent-ISRD" /> <meta name="Copyright" content="Tencent" /> <title>Border-image</title> </head> <body>
box-shadow
Border-color
版本：CSS3 继承性：无
语法：
border-color ： < color> 相关属性：border-top-color, border-right-color, border-bottom -color , border-left-color

CSS 3.0参考手册

css3.0参考手册Table of Contents1. CSS3 Properties (3)Borders (3)Backgrounds (3)Color (3)Text effects (3)User-interface (4)Selectors (4)Basic box model (4)Generated Content (4)Other modules (4)1.1 边框(Border) (4)1.1.1 Border-color (5)1.1.2 Border-image (6)1.1.3 Border-radius (8)1.1.4 box-shadow (10)1.2 背景(Background) (11)1.2.1 background-origin (11)1.2.2 background-clip (13)1.2.3 Background-size (14)1.2.4 Multiple backgrounds (16)1.3 颜色(Color) (18)1.3.1 HSL colors (19)1.3.2 HSLA colors (20)1.3.3 opacity (21)1.3.4 RGBA colors (22)1.4 文本(Text effects) (24)1.4.1 text-shadow (24)1.4.2 text-overflow (26)1.4.3 word-wrap (27)1.5 用户界面(User-interface) (28)1.5.1 box-sizing (28)1.5.2 resize (30)1.5.3 outline (31)1.5.4 outline-width (33)1.5.5 outline-style (34)1.5.6 outline-offset (36)1.5.7 outline-color (37)1.5.8 nav-index (38)1.5.9 nav-up (40)1.5.10 nav-right (41)1.5.11 nav-down (42)1.5.12 nav-left (43)1.6 基础盒模型(Basic box model) (44)1.6.1 overflow (44)1.6.2 overflow-x (46)1.6.3 overflow-y (47)1.7 内容(Generated Content) (49)1.7.1 content (49)1.8 其它模块(Other modules) (50)1.8.1 media queries (51)1.8.2 Speech (52)1.8.3 columns (55)1.8.4 column-width (57)1.8.5 column-span (59)1.8.6 column-rule (60)1.8.7 column-rule-color (62)1.8.8 column-rule-width (64)1.8.9 column-rule-style (65)1.8.10 column-gap (68)1.8.11 column-fill (70)1.8.12 column-count (71)1.8.13 column-break-before (72)1.8.14 column-break-after (74)1.8.15 @font-face (75)2. 选择器(selectors) (77)2.1 子串匹配的属性选择符E[att^="val"] (78)2.2 子串匹配的属性选择符E[att$="val"] (79)2.3 子串匹配的属性选择符E[att*="val"] (80)2.4 结构性伪类E:root (81)2.5 结构性伪类E:nth-child(n) (82)2.6 结构性伪类E:nth-last-child(n) (83)2.7 结构性伪类E:nth-of-type(n) (84)2.8 结构性伪类E:nth-last-of-type(n) (85)2.9 结构性伪类E:last-child (86)2.10 结构性伪类E:first-of-type (87)2.11 结构性伪类E:only-child (88)2.12 结构性伪类E:only-of-type (89)2.13 结构性伪类E:empty (90)2.14 UI元素状态伪类E:checked (91)2.15 UI元素状态伪类E:enabled (92)2.16 UI元素状态伪类E:disabled (93)2.17 UI元素状态伪类E::selection (94)2.18 否定伪类E:not(s) (95)2.19 目标伪类E:target (96)2.20 通用兄弟元素选择器E ~ F (97)1. CSS3 Properties 属性列表Borders∙border-color(See 1.1.1)∙border-image(See 1.1.2)∙border-radius(See 1.1.3)∙box-shadow(See 1.1.4) Backgrounds∙background-origin(See 1.2.1)∙background-clip(See 1.2.2)∙background-size(See 1.2.3)∙multiple backgrounds(See 1.2.4) Color∙HSL colors(See 1.3.1)∙HSLA colors(See 1.3.2)∙opacity(See 1.3.3)∙RGBA colors(See 1.3.4)Text effects∙text-shadow(See 1.4.1)∙text-overflow(See 1.4.2)∙word-wrap(See 1.4.3)User-interface∙box-sizing(See 1.5.1)∙resize(See 1.5.2)∙outline(See 1.5.3)∙nav-up(See 1.5.9) , nav-right(See 1.5.10) , nav-down(See 1.5.11) , nav-left(See 1.5.12) Selectors∙attribute selectors(See 2.)Basic box model∙overflow-x(See 1.6.2) , overflow-y(See 1.6.3)Generated Content∙content(See 1.7.1)Other modules∙media queries(See 1.8.1)∙multi-column layout(See 1.2.4)∙Web fonts(See 1.8.15)∙speech(See 1.8.2)1.1 边框(Border)属性列表∙border-color(See 1.1.1)∙border-image(See 1.1.2)∙border-radius(See 1.1.3)∙box-shadow(See 1.1.4)1.1.1 Border-color继承性：无语法：border-color：<color>相关属性：border-top-color, border-right-color, border-bottom-color , border-left-color取值：<color>：颜色值。

CSS速查手册

CSS 指层叠样式表(C ascading S tyle S heets)。

CSS 背景属性（Background）属性描述CSS background在一个声明中设置所有的背景属性。

1 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。

1 background-color设置元素的背景颜色。

1 background-image设置元素的背景图像。

1 background-position设置背景图像的开始位置。

1 background-repeat设置是否及如何重复背景图像。

1 CSS 边框属性（Border 和 Outline）属性描述CSS border在一个声明中设置所有的边框属性。

1 border-bottom在一个声明中设置所有的下边框属性。

1 border-bottom-color设置下边框的颜色。

2 border-bottom-style设置下边框的样式。

2 border-bottom-width设置下边框的宽度。

1 border-color设置四条边框的颜色。

1 border-left在一个声明中设置所有的左边框属性。

1 border-left-color设置左边框的颜色。

2 border-left-style设置左边框的样式。

2 border-left-width设置左边框的宽度。

1 border-right在一个声明中设置所有的右边框属性。

1 border-right-color设置右边框的颜色。

2 border-right-style设置右边框的样式。

2 border-right-width设置右边框的宽度。

1 border-style设置四条边框的样式。

1 border-top在一个声明中设置所有的上边框属性。

1 border-top-color设置上边框的颜色。

2 border-top-style设置上边框的样式。

css语法手册全集(不看你会后悔的)

CSS语法手册全集（不看你会后悔的！）CSS语法手册（一）字体属性1、font-family功能：用于改变HTML标志或元素的字体，你可设置一个可用字体清单。

浏览器由前向后选用字体。

数值：normal - 正常italic - 斜体oblique - 偏斜体例子：NormalItalicOblique3、font-variant功能：用于在正常与小型大写字母字体间切换。

数值：normal - 如果该标志继承父元素的small-caps 设置，则关键字normal 将font-variant 设置为正常字体。

small-caps - 把小写字母显示为字体较小的大写字母。

例子：FONT-VARIANT4、font-weight功能：用于设置字体灰度，生成字体的深，浅版本。

数值：正常灰度- normal相对灰度- bold, bolder, light, lighter梯度灰度- 取值如下：100, 200, 300, 400(相当于normal), 500, 600, 700(相当于bold), 800, 900。

例子：字体灰度5、font-size功能：用各种度量单位控制文本字体大小。

数值：有四种数值方式绝对尺寸- 用具体字号表定义字体大小，可以取下列数值之一：xx - small, x-small, small, medium, large, x-large,xx-large。

不同字体有不同的数值。

相对尺寸- larger, smaller，产生的尺寸是相对于父容器字号而言的。

长度- 用毫米(mm)，厘米(cm)，英寸(in)，点数(pt)，象素(px)，pica(pc)，ex(小写字母x的高度)或em(字体高度)作为度量单位。

百分比- 相对于其父元素字体大小的百分比。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

CSS 背景属性（Background）属性描述CSS background在一个声明中设置所有的背景属性。

1 background-attachment设置背景图像是否固定或者随着页面的其余部分滚动。

1 background-color设置元素的背景颜色。

1 background-image设置元素的背景图像。

1 background-position设置背景图像的开始位置。

1 background-repeat设置是否及如何重复背景图像。

1CSS 边框属性（Border 和Outline）属性描述CSS border在一个声明中设置所有的边框属性。

1 border-bottom在一个声明中设置所有的下边框属性。

1 border-bottom-color设置下边框的颜色。

2 border-bottom-style设置下边框的样式。

2 border-bottom-width设置下边框的宽度。

1 border-color设置四条边框的颜色。

1 border-left在一个声明中设置所有的左边框属性。

1 border-left-color设置左边框的颜色。

2 border-left-style设置左边框的样式。

2 border-left-width设置左边框的宽度。

1 border-right在一个声明中设置所有的右边框属性。

1 border-right-color设置右边框的颜色。

2 border-right-style设置右边框的样式。

2 border-right-width设置右边框的宽度。

1 border-style设置四条边框的样式。

1 border-top在一个声明中设置所有的上边框属性。

1 border-top-color设置上边框的颜色。

2 border-top-style设置上边框的样式。

2 border-top-width设置上边框的宽度。

1 border-width设置四条边框的宽度。

1 outline在一个声明中设置所有的轮廓属性。

2 outline-color设置轮廓的颜色。

2 outline-style设置轮廓的样式。

2 outline-width设置轮廓的宽度。

2CSS 文本属性（Text）属性描述CSS color设置文本的颜色。

1 direction规定文本的方向/ 书写方向。

2 letter-spacing设置字符间距。

1 line-height设置行高。

1 text-align规定文本的水平对齐方式。

1text-decoration规定添加到文本的装饰效果。

1 text-indent规定文本块首行的缩进。

1 text-shadow 规定添加到文本的阴影效果。

2 text-transform控制文本的大小写。

1 unicode-bidi设置文本方向。

2 white-space规定如何处理元素中的空白。

1 word-spacing设置单词间距。

1CSS 字体属性（Font）属性描述CSS font在一个声明中设置所有字体属性。

1 font-family规定文本的字体系列。

1 font-size规定文本的字体尺寸。

1 font-size-adjust为元素规定aspect 值。

2 font-stretch收缩或拉伸当前的字体系列。

2 font-style规定文本的字体样式。

1 font-variant规定文本的字体样式。

1 font-weight规定字体的粗细。

1CSS 外边距属性（Margin）属性描述CSS margin在一个声明中设置所有外边距属性。

1 margin-bottom设置元素的下外边距。

1 margin-left设置元素的左外边距。

1 margin-right设置元素的右外边距。

1 margin-top设置元素的上外边距。

1CSS 内边距属性（Padding）属性描述CSS padding在一个声明中设置所有内边距属性。

1 padding-bottom设置元素的下内边距。

1 padding-left设置元素的左内边距。

1 padding-right设置元素的右内边距。

1 padding-top设置元素的上内边距。

1CSS 列表属性（List）属性描述CSS list-style在一个声明中设置所有的列表属性。

1list-style-image将图象设置为列表项标记。

1list-style-position设置列表项标记的放置位置。

1list-style-type设置列表项标记的类型。

1 marker-offset 2内容生成（Generated Content）属性描述CSS content与:before 以及:after 伪元素配合使用，来插入生成内容。

2 counter-increment递增或递减一个或多个计数器。

2 counter-reset创建或重置一个或多个计数器。

2 quotes设置嵌套引用的引号类型。

2CSS 尺寸属性（Dimension）属性描述CSS height设置元素高度。

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

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

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

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

2 width设置元素的宽度。

1CSS 定位属性（Positioning）属性描述CSS bottom设置定位元素下外边距边界与其包含块下边界之间的偏移。

2 clear规定元素的哪一侧不允许其他浮动元素。

1 clip剪裁绝对定位元素。

2 cursor规定要显示的光标的类型（形状）。

2 display规定元素应该生成的框的类型。

1 float规定框是否应该浮动。

1left设置定位元素左外边距边界与其包含块左边界之间的偏移。

2 overflow规定当内容溢出元素框时发生的事情。

2 position规定元素的定位类型。

2 right设置定位元素右外边距边界与其包含块右边界之间的偏移。

2top设置定位元素的上外边距边界与其包含块上边界之间的偏移。

2 vertical-align设置元素的垂直对齐方式。

1 visibility规定元素是否可见。

2z-index设置元素的堆叠顺序。

2 CSS 打印属性（Print）属性描述CSS orphans 设置当元素内部发生分页时必须在页面底部保留的最少行数。

2 page-break-after设置元素后的分页行为。

2 page-break-before设置元素前的分页行为。

2 page-break-inside设置元素内部的分页行为。

2 widows 设置当元素内部发生分页时必须在页面顶部保留的最少行数。

2CSS 表格属性（Table）属性描述CSSborder-collapse规定是否合并表格边框。

2 border-spacing规定相邻单元格边框之间的距离。

2 caption-side规定表格标题的位置。

2 empty-cells规定是否显示表格中的空单元格上的边框和背景。

2 table-layout设置用于表格的布局算法。

2CSS 伪类（Pseudo-classes）属性描述CSS:active向被激活的元素添加样式。

1:focus向拥有键盘输入焦点的元素添加样式。

2:hover当鼠标悬浮在元素上方时，向元素添加样式。

1:link向未被访问的链接添加样式。

1:visited向已被访问的链接添加样式。

1:first-child向元素的第一个子元素添加样式。

2:lang向带有指定lang 属性的元素添加样式。

2CSS 伪元素（Pseudo elements）属性描述CSS:first-letter向文本的第一个字母添加特殊样式。

1:first-line向文本的首行添加特殊样式。

1:before在元素之前添加内容。

2:after在元素之后添加内容。

2打印属性打印HTML 文档总是会出现问题。

在CSS2 中，我们可以借助打印属性让打印web 内容更容易一些。

属性描述值orphans 设置元素放在页面底部时所允许的最少文本行数。

numbermarks 设置是否在内容区之外但是在画布的可打印区域内放“十字标志”。

请注意，CSS2.1 已删除该属性。

•none•crop•crosspage 这个属性与size 属性结合可以指定打印一个元素时所用的特定页面类型。

请注意，CSS2.1 已删除该属性。

auto identifierpage-break-after设置元素后是否应当放置分页符。

•auto •always •avoid •left •rightpage-break-before设置元素前否应当放置分页符。

•auto •always •avoid •left •rightpage-break-inside设置元素内部是否应当放置分页符。

•auto •avoidsize 利用这个属性，创作人员可以声明打印一个元素时所用页框的大小和方向。

它可以与page 结合使用。

不过并不要求一定如此。

请注意，CSS2.1 已删除该属性。

•auto•portrait•landscapewidows 设置元素放在页面顶部时所允许的最少文本行数。

number 尺寸单位描述% 百分比in 英寸cm 厘米mm 毫米em 1em 等于当前的字体尺寸。

2em 等于当前字体尺寸的两倍。

例如，如果某元素以12pt 显示，那么2em 是24pt。

在CSS 中，em 是非常有用的单位，因为它可以自动适应用户所使用的字体。

ex 一个ex 是一个字体的x-height。

(x-height 通常是字体尺寸的一半。

) pt 磅(1 pt 等于1/72 英寸)pc 12 点活字(1 pc 等于12 点)px 像素(计算机屏幕上的一个点)颜色单位描述(颜色名) 颜色名称(比如red)rgb(x,x,x) RGB 值(比如rgb(255,0,0))rgb(x%, x%, x%) RGB 百分比值(比如rgb(100%,0%,0%))#rrggbb 十六进制数(比如#ff0000)。