CSS3选择器、背景、边框、文本

选择器：

[attribute^=value] 属性值以value开头的元素

[attribute&=value] 属性值以value结束的元素

[attribute*=value] 属性值包含value的元素

:first-of-type 父元素第一个兄弟元素

:last-of-type 父元素最后一个兄弟元素

:only-child 父元素只有唯一一个子元素

:only-of-type 父元素只有唯一一个兄弟元素

:nth-child(n) 父元素第n个子元素

:nth-last-child(n) 父元素倒数第n个子元素

:nth-of-type(n) 父元素第n个兄弟元素

:empty 没有子元素的元素

:checked 被选中的元素

 

边框：

border-radius:圆角边框

border-radius:length;

/*以length为半径的圆角*/

 

box-shadow:边框阴影

box-shadow:h-shadow v-shadow blur spread color inser/outset;

/*h-shadow:水平位置,v-shadow:垂直位置,blur:模糊距离,spread:阴影尺寸,color:阴影颜色,inser:内部阴影/outset:外边阴影*/

 

border-image:边框图片

border-image-source:图片路径

border-image-slice:边框向内偏移

border-image-width:图片边框宽度

border-image-outset:边框图像超出边框的量

border-image-repeat:边框是否平铺(repeated)、铺满(rounded)、拉伸(stretched)

 

背景：

background-clip:背景绘制区域 border-box、padding-box、content-box

backdround-origin:背景定位 border-box、padding-box、content-box

background-size:length | percentage | cover | contain

/*length:图片宽高：第一个值宽度,第二个值高度*/

/*percentage:以父元素百分比宽高：一宽，二高*/

/* cover:完全覆盖背景区域*/

/*contain:完全覆盖内容区域*/

 

文本：

text-shadow:文本阴影

text-shadow:h-shadow v-shadow blur color

/*h-shadow:水平位置,v-shadow:垂直位置,blur:模糊距离,color:阴影颜色*/

 

word-wrap:换行

word-warp:normal(断字点换行)|break-wrap(长单词或URL换行)