css3属性（一）

圆角效果：
border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角、右上角、右下角和左下角，顺时针 */

阴影：
box-shadow:X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式(inset)];
1、阴影模糊半径与阴影扩展半径的区别
阴影模糊半径：此参数可选，其值只能是为正值，如果其值为0时，表示阴影不具有模糊效果，其值越大阴影的边缘就越模糊；
阴影扩展半径：此参数可选，其值可以是正负值，如果值为正，则整个阴影都延展扩大，反之值为负值时，则缩小；
2、X轴偏移量和Y轴偏移量值可以设置为负数
3.注意：inset 可以写在参数的第一个或最后一个，其它位置是无效的。
4.如果添加多个阴影，只需用逗号隔开即可。如：
.box_shadow{box-shadow:4px 2px 6px #f00, -4px -2px 6px #000, 0px 0px 12px 5px #33CC00 inset;}

为边框应用图片:
border-image:url(xx.jpg) 10px 20px no-repeat/repeat/round/stretch;

颜色RGBA
RGBA(0,0,0,0.5)最后值为透明度

渐变色彩
back-image下属性
1.线性渐变：linear-gradient(to bottom/180deg，#fff，#999)
参数分别为渐变方向、角度或方向、开始位置颜色、结束位置颜色
2.径向渐变：radial-gradient

文本的溢出省略
text-overflow:clip/ellipsis 剪切/显示省略标记
white-space:nowrap; 文本控制在一行
word-wrap:normal/break-word 控制文本连续换行/断开换行

字体
@font-face{
font-family:字体名词；
src:路径；
.eot;/* IE9*/
.eot?#iefix/* IE6-IE8 */
.woff') /* chrome、firefox */
.ttf/* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
.svg/* iOS 4.1- */
}

文本阴影：
text-shadow:X-Offset Y-Offset blur color;水平偏移量、垂直偏移量、阴影模糊程度、阴影颜色；

背景图片原始起始位置
backgroud-origin:border-box | padding-box | content-box; 边框、内边距、内容区域（如果背景不是no-repeat，这个属性无效）

背景裁剪
background-clip：border-box/padding-box/content-box/no-clip 从（边框、内填充、内容区域、不裁剪）向外裁剪背景

backgroud-size:auto/长度值/百分比/cover/contain
1.cover:将背景图片等比例缩放以填满整个容器
2.contain:将背景图片等比例缩放至某一边紧贴容器边缘为止