标签：
css3边框
border-radius属性用于创建圆角 最简单示例设置边框border大小、宽、高，直接添加属性。如以下代码：
div{border:2px solid;
border-radius:20px
width:300px height:300px
如果输入了内容的话可以不要高度输入padding（内边距）即可
box-shadow用于向方框添加阴影。在圆角的元素下只需要添加box-shadow:10px 10px 5px 颜色即可。其中第一个px为向右阴影，第二个为向下，第三个为阴影模糊度，最后颜色。
border-image可以使用图片来创建边框。除了基本的操作外还需要增加border-image:url(图片地址） 30 30 round；30为方向拉扯单位，round为幅度，与其对应的是stretch.
css3背景
background-size属性规定背景图片的尺寸，示例代码background-size:63px 100px;(使用百分比的话，会进行拉伸，其实并没有什么卵用）
background-repeat:no-repeat;
padding-top:80px;
CSS3文本效果
text-shadow可向文本应用阴影，跟边框一样的语法
css3自动换行使用word-warp，示例：width:11em; （一般不要太长，不然怎么试的出来）
border:1px solid #000000;（边框属性）
word-wrap:break-word;(强制自动换行）
css3字体
@font-face 来设置字体，示例：
@font-face（意思就是要换字体了）
{
font-family: myFirstFont;（字体名字）
src: url(‘../example/css3/Sansation_Light.ttf‘)（要引入的字体文件）
}
div
{
font-family:myFirstFont;（定义字体名字)
}
就是个鸡肋，纯属蛋疼！
css3 2D转换
translate(50px,100px) 把元素从左侧移动 50 像素，从顶端移动 100 像素。
通过 rotate() 方法，元素顺时针旋转给定的角度。允许负值，元素将逆时针旋转。
通过 scale() 方法，元素的尺寸会增加或减少，根据给定的宽度（X 轴）和高度（Y 轴）参数：
通过 skew() 方法，元素翻转给定的角度，根据给定的水平线（X 轴）和垂直线（Y 轴）参数：
css3过渡
规定您希望把效果添加到哪个 CSS 属性上
规定效果的时长
div
{
width:100px;
height:100px;
background:yellow;
transition:width 2s;（宽度动画效果持续两秒）
}
div:hover
{
width:300px;（鼠标悬停时，2秒内宽度由100px转换为300，加上height就可以宽高同时变换）
}
transition-property: width;（变换属性）
transition-duration: 1s;（时间）
transition-timing-function: linear;（速度）
transition-delay: 2s;（传说中的延迟）
简写：transition: width 1s linear 2s（跟上面的对号入座）
*****其实最重要的是兼容问题，每种属性变换都有不同的浏览器支持，一定要记住！！！！！！
CSS3动画
animation-name: myfirst;动画的名称
animation-duration: 5s;动画时间
animation-timing-function: linear;动画速度
animation-delay: 2s;延迟
animation-iteration-count: infinite;播放次数
animation-direction: alternate;是否在下一次逆向播放
animation-play-state: running;规定动画是否在运行或暂停（智商有限，没搞懂）
简写：animation: myfirst 5s linear 2s infinite alternate;对号入座
标签：
原文地址：http://www.cnblogs.com/wx2021204/p/4909915.html
