CSS中文速查表(CSS Cheat Sheet)
这是一个简易的CSS中文速查表,在下面有提供html版本及一个非常全的CSS手册下载。
| 语法 |
|---|
| 语法 |
| selector {property: value;} |
| 引用外部样式表 |
| <link rel=”stylesheet” type=”text/css” href=”style.css” /> |
| 声明内部样式 |
| <style type=”text/css”> selector {property: value;} </style> |
| 声明行内样式 |
| <tag style="property: value"> |
| 一般性语法 | |
|---|---|
| Class | 类选择符 |
| ID | ID选择符 |
| div | 块状元素格式化 |
| span | 行内格式化 |
| color | 字体颜色 |
| cursor | 光标样式 |
| display | block; inline; list-item; none
|
| overflow | 处理内容在容器中的溢出效果
visible, hidden, scroll, auto
|
| visibility | visible, hidden
|
| 字体 | |
|---|---|
| font-style | Italic, normal
|
| font-variant | normal, small-caps
|
| font-weight | bold, normal, lighter, bolder, 数字 (100-900)
|
| font-size | 字体大小 |
| font-family | 指定字体 |
| 文本 | |
|---|---|
| letter-spacing | 字符间距 |
| line-height | 两行基线之间的垂直距离 |
| text-align | 水平对齐方式 |
| text-decoration | blink, line-through, none, overline, underline
|
| text-indent | 第一行缩进 |
| text-transform | capitalize, lowercase, uppercase
|
| vertical-align | 垂直方向对其 |
| word-spacing | 英文单词的间距 |
| 盒模型 | |
|---|---|
| height; width; margin-top; margin-right; margin-bottom; margin-left; padding-top; padding-right; padding-bottom; padding-left; |
|
| 边框 | |
|---|---|
| border-width | 边框的粗细 |
| border-style | dashed; dotted; double; groove; inset; outset; ridge; solid; none
|
| border-color | 边框颜色 |
| 位置 | |
|---|---|
| clear | 指定了不允许有浮动对象的边
both, left, right, none
|
| float | 指定向某个方向浮动
left, right, none
|
| left | 元素据左边边界的距离
auto, length values (pt, in, cm, px)
|
| top | 元素距上边界的距离
auto, length values (pt, in, cm, px)
|
| position | static, relative, absolute
|
| z-index | 设置元素的层叠顺序
auto, integer (higher numbers on top)
|
| BACKGROUND | |
|---|---|
| background-color | 背景颜色 |
| background-image | 背景图片 |
| background-repeat | repeat, no-repeat, repeat-x, repeat-y
|
| background-attachment | 背景图片是否跟随元素滚动
scroll, fixed
|
| background-position | (x y), top, center, bottom, left, right
|
| 列表 | |
|---|---|
| list-style-type | 列表的预设标记类型
disc; circle; square; decimal; lower-roman; upper-roman; lower-alpha; upper-alpha;
none |
| list-style-position | 预设标记在列表中的位置
inside; outside
|
| list-style-image | 在列表预设标记中使用图片 |
* 以上每个选择器列出的属性顺序就是它在缩写声明时的顺序
上面速查表的HTML版本:CSS中文速查手册HTML版 [下载次数:452]
附上我认为最好的一个CSS手册(又全又精美):CSS chm手册 [下载次数:561]
有朋友留言说上面的CSS手册下载下来是空白打不开,我测试了几遍,发现确实有这样的情况,估计有可能是后缀名或文件格式的原因,附上一个压缩版本:
CSS手册压缩包版 [下载次数:684]评论

React 18的并发渲染确实是个重大改进,我们在项目中已经升级使用,性能提升明显!