今天翻手机，翻到了许久之前看css权威指南时的笔记，遂移到博客中来。

1.属性选择器

p.one class名为one的p元素

p[class][name] 含有class和name属性的p元素

p[class="one"][name="two"] class属性为one且name属性为two的p元素

p[class~="one"] class属性包含one的p元素

p[class^="one"] class属性以one开头

p[class$="one"] class属性以one结尾

p[class*="one"] class属性包含one

p[class|="one"] class属性为one或以之开头

2.伪类

链接的伪类:link :visited :focus :hover :active

:lang(fr) 类似于|=，意为语言为法语的元素

 

3.伪元素

:first-letter

:first-line

:before {content:"前面插入的内容";color:red;}

 

4.特殊性值

ID # 0,1,0,0

Class 0,0,1,0

P标签名 0,0,0,1

通配符* 0,0,0,0

伪类 特殊性值没有

 

5.字体变形

font-variant:small-caps 小型大写字母

text-transform:uppercase 字母大写

capitalize 首字母大写

字体下载

@font-face{font-family:"name";src: url("www");}

 

6.文本格式

p{text-indent:3em;}段落首行缩进3字符

text-align:center;居中

word-spacing:1em文字间隔

letter-spacing:1em 字母间隔

 

7.DOM可见性

visibility 属性

hidden 元素不可见，但保留在文档中的位置（该属性可继承，如果要求部分子元素显示要显式声明此部分visibility:visible）

而overflow的hidden,元素不可见的同时也不会占据文档流

 

8.定位

Relative 相对定位元素

当发生冲突时bottom=-top值，right=-left

Absolute绝对定位元素

如果不定义height、width；left、right的值将影响元素大小（拉伸/压缩）

 

9.表格

Border-collapse:collapse

用于表格单元格中间空隙合并

table{border-space:1px 3px;}

表单元格之间x轴空隙1px；y轴空隙3px。

li{list-style-image:url(...);}

为列表标志改变默认样式（改用图片）

li{list-style-position:inside;}

将标志（小圆点）置于列表项内部，默认值是outside，所以我们通常看到的小圆点是在外面的

 

10.a标签手势

a:hover{cursor:pointer;}

该属性使得光标形状变成“手”

crosshair十字准星

 

11.边框轮廓

outline-style

轮廓样式，类似于元素边框，可以包在边框外面