绘制圆形

 border-XX-XX-radius
1.可以通过 border-XX-XX-radius的方式单独设置某一个角的值
2.border-XX-XX-radius接收两个参数，第一个表示水平方向，第二个垂直方向
3.例如：border-top-left-radius：50%
 技巧：在企业开发中推荐使用如下的方式让浮动元素居中
水平居中：left：50%；transform：translateX(-50%)；
垂直居中：right：50%；transform：translateY(-50%)；
 border-image：资源地址 切割模式 填充模式
1.border-image-source：url()--告诉浏览器让哪一张图片成为边框，默认情况下会将图片放到边框的四个顶点，如果设置了边框图片，就不会显示边框颜色。
2.border-image-slice：70 70 70 70；---对指定的边框图片进行切割。
3.border-image-width：10px;指定了宽度，原本的border的宽度就会失效。
4.border-image-repeat：stretch(默认值，拉伸)/repeat(平铺)/round(拉伸+平铺)
 verticle-align这是元素的垂直对齐方式
1.默认情况下图片和一行文字的基线对齐(基线就是一行文字中最短那个文字的底部)。
2.text-align是设置给需要对齐元素的父元素，verticle-align是设置给需要对齐的那个元素本身。
3.verticle-align只对行内元素有效。

 

 

 

 

来自为知笔记(Wiz)

转载于:https://www.cnblogs.com/Shuangyi/p/11493689.html