CSS3边框

border-radius：

border-radius属性为元素添加圆角边框。数值越小，弧度越小。

语法：

1. border-radius:none;
2. border-radius:m;一个数值代表四个角的x轴，y轴方向半径都一样。
3. border-radius:m m;两个数值分别代表左上，右下/右上，左下的x轴，y轴方向的半径。
4. border-radius:m m m;三个数值代表左上/右上，左下/右下的x轴，y轴方向的半径。
5. border-radius:m m m m;四个数值分别代表左上，右上，右下，左下的x轴，y轴方向的半径。
6. border-radius:x x x x/y y y y;前四个数值代表左上，右上，右下，左下的x轴方向的半径，后四个数值代表左上，右上，右下，左下的y轴方向的半径。

border-image:

border-image属性用于为元素添加边框背景。语法：border-image:source slice width outset repeat;

属性值：

1. source:定义边框的背景图片源，即图像的URL。
2. slice:定义如何裁切背景图像。默认像素数，也可以用百分比。
3. width:定义边框背景图像的显示大小，及边框显示大小。
4. outset：定义边框背景图像的偏移位置。目前所有浏览器都不支持。
5. repeat：定义边框背景图像的重复性。属性值有repeated(重复),stretched(拉伸),rounded(铺满)。
   

border-image:url(“ “) 30 15px round;//30的单位默认是px，代表上右下左分别向对应方向的30px处划一条线，将图片划分成9个部分，每个部分对应添加到元素中去。

box-shadow:

box-shadow属性为元素添加盒阴影。语法：box-shadow:h-shadow v-shadow blur spread color inset;

属性值：

1. h-shadow:必选。阴影的x轴偏移距离。为像素数，允许负值。
2. v-shadow:必选。阴影的y轴偏移距离。为像素数，允许负值。

h-shadow和v-shadow都为正值时，阴影在右下角。h-shadow和v-shadow都为负值时，阴影在左上角。h-shadow为正值，v-shadow为负值时，阴影在右上角。h-shadow为负值，v-shadow为正值时，阴影在左下角。

3. blur：可选。模糊距离。为像素数，只能为正值。值越大，边缘越模糊。值为0时表示不具有模糊效果。
4. spread：可选。阴影的大小。为像素数，允许负值。正值时阴影延展扩大，负值时阴影会缩小。
5. color：可选。阴影的颜色。
6. inset：可选。从外层阴影改变内层阴影。

resize属性指定一个元素是否可以由用户去调整大小。Firefox 4+、 Chrome和 Safari支持这个属性。

div{
   resize:both;
   overflow:auto;
}

拖动右下角即可调整div的大小

来源：CSDN

作者：花铛

链接：https://blog.csdn.net/wsln_123456/article/details/103999064