CSS3——基本内容

一、CSS3边框
1、圆角边框：
border-radius: 0 0 0 0; —4个零分别表示上右下左四个角圆的程度，一般的圆角范围会在1-5px之间。

2、边框阴影：
box-shadow: 0 0 0 color; —前面2个零分别表示右 下 阴影的拓展程度，第三个零表示阴影的“浓度”最后一个表示阴影的颜色。

3、边框图片：
border-image :url() 0 0 round; —用来创造边框的图片效果，url表示图片的连接，0 0 round表示图片的分散程度。注意：Internet Explorer 不支持 border-image 属性。

二、CSS3背景：
1、background-size: 0 0; —用来规定背景图片的尺寸，第一个0指的是宽度，第二个0指的是高度，可以用像素和百分比来规定尺寸，如果用百分比来规定尺寸的话，其尺寸是相对于父元素的宽度和高度。

2、background-origin：content-box/padding-box/border-box; —用来规定背景图片的定位区域，例如内容、内间距、边框。

三、CSS3文本效果：
1、text-shadow: 0 0 0 color; —前面2个零分别表示右 下 阴影的拓展程度，第三个零表示阴影的“浓度”最后一个表示阴影的颜色。

2、word-wrap:break-word; —自动换行效果，但是会对单词进行拆分。

四、CSS3转换-2D：
1、transform:translate(x,y); —元素从当前位置移动，根据给定的left（x坐标）和top（y坐标）位置参数。

2、transform:rotatd(0deg); —元素顺时针旋转给定的角度，假如值是负，元素将逆时针旋转。

3、transform：scale(x，y); —元素的尺寸会增加或减少，根据给定的宽度（X轴）和高度（Y轴）参数。这里的XY指的都是原来尺寸的多少倍。

4、transform：skew(xdeg,ydeg); —元素翻转给定的角度，根据XY轴的参数，围绕X轴将元素翻转X度，围绕Y轴翻转Y度。

5、transform：matrix(0,0,0,0,0,0,); —把所有2D转换方法组合在一起，需要6个参数，允许旋转、缩放、移动以及倾斜元素。

五、CSS3转换-3D：
1、transform：royayeX(0deg); —元素围绕其X轴以给定的度数进行旋转。

1、transform：royayeY(0deg); —元素围绕其Y轴以给定的度数进行旋转。

六、CSS3过渡：
transition:width 2s ,height 2s,transform 2s; —用于在一个属性设置多个过渡属性，一定要规定过渡的时长，如果未规定，则不会有效果，因为默认为0。

七、CSS3多列：
1、column-count:x; —把元素中的文本分为x列。

2、column-gap:(); —规定列与列之间的间隔。

3、column-rule:width style color; —规定列与列之间的宽度、样式和颜色规则。

八、CSS3用户界面：
1、resize:none/both/horizontal/vertical; —规定用户是否可以调整元素的尺寸，无法调整/可以调整高度宽度/可以调整宽度/可以调整高度。

2、box-sizing:content-box/border-box/inherit; —允许以特定的方式定义匹配某个区域的特定元素。

3、outline-offset:x px; —对轮廓就行偏移，并在轮廓边缘的位置绘制轮廓。