CSS学习笔记-边框图片等属性

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1、边框图片：
1.1含义：
告诉浏览器指定一张图片作为边框
1.2格式：
border-image-source:url("images/..");
1.3注意点：
(1)如果只通过source指定了一张图片作为边框的图片，默认情况下会将图片放到边框的四个顶点
(2)边框图片的优先级高于边框颜色，即设置了边框图片那就不会显示边框颜色
2、对图片进行切割：
2.1格式：
border-image-slice:70 70 70 70;
2.2含义：
参数没有单位，意味着对边框图片顶部距离70的位置横向切割，对边框右边距离70的位置竖向切割，下边、左边以此类推..
3、边框宽度属性：
3.1格式：
border-image-width:10px;
3.2含义：
此属性不会影响边框的实际宽度，仅改变边框图片显示的宽度;
4、填充方式：
4.1格式：
border-image-repeat:stretch;
4.2含义：
图片除了四个角外的其他部分的填充方式
4.3取值：
stretch :拉伸
repeat ：忘两边平铺
round ：拉伸平铺结合