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:拉伸平铺结合
本节单词:
border:边框、边界
source:来源
slice:切开、割破
stretch:拉伸
round:环形、周围、围绕
原文:https://www.cnblogs.com/AsVR-Sharemju/p/12032179.html