CSS选择器

ID选择器

Tagname选择器

className选择器

交叉选择器

群组选择器

后代选择器

通用选择器

Css特性

继承性

叠加性

优先级

后代元素的选择器

:nth-child(n);

Even  // 选择奇数

Odd //选择偶数

:only-child;

:nth-last-child(n);  //从后面数

:first-child; //第一个div

:last-child; //最后一个div

:root //选择根元素

:empty  //选择控元素的div

同级选择器

ele~ele2 //匹配同级元素

:first-of-type //指定同级第一个子元素

:last-of-type //指定同级最后一个子元素

:only-of-type //只能有一个元素 只包含一个子元素

:only-child;

:nth-of-type(n);  //同辈元素第几个

 

伪类：同一个元素在不同元素下的表现形式

:fouse

:before

:after

:target

::selection

响应式布局

@Media

 

<style>

@media screen and(min-width:1024px;){

.one{

width:200px;height:100px;border:1px solid #f00;

}

}

</style>

用户界面

div{

width:500px;

height:500px;

margin: 100px auto;

-moz-columns:3 10px;

-moz-column-gap:10px;

-moz-column-rule:1px solid blue;

border:1px solid red;

resize:both;

outline:green;

outline-offset:4px;

}

2D转换

transform:translate(X,Y);

旋转缩放

时钟