css3边框、背景、过渡以及动画

一、边框

border-radius：

        原理以值为半径在四角画圆或椭圆

        椭圆角：x轴半径/y轴半径

        四个值时从左上、右上、右下、左下顺时针开始；

        三个值时左上、右下和左下、右下；

四个值：

border-radius: 10px 20px 20px 40px;

三个值：

border-radius: 10px 20px 40px;

两个值：

border-radius: 10px 40px;

 

box-shadow：

        值：水平位置 垂直位置 模糊距离 阴影尺寸大小 阴影颜色 内(inset)/外阴影

        说明：前俩个值必须写，模糊距离不能为负值

 

边框图片border-image:

        可以使图像创建一个边框

        border-image-source：边框背景图片路径

        border-image-slice：图片边框向内偏移(切片)

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

        border-image-outset：边框图像区域超出边框的量

        border-im