border-image用法

陪你天天看日出

于 2017-07-03 16:07:14 发布

阅读量303

点赞数

分类专栏： css 文章标签： css

本文链接：https://blog.youkuaiyun.com/qq_15701939/article/details/74204250

版权

3 篇文章

订阅专栏

border-image 语法

border-image: border-image-source border-image-slice border-image-repeat;
border-image: url("/images/border.png") 30 repeat;

css属性	值
border-image-source	none（默认）、url(“”)
border-image-slice	切割图片的宽度、有四个方向top、right、bottom、left，可简写。特殊：不切割的时候用100%,0
border-image-repeat	stretch(默认、拉伸)、 repeat(平铺)、round(整数次平铺)

有个高为15px的小图，平铺在footer的border-bottom

footer{
    border-width: 0 0 15px 0;
    border-bottom: 15px solid transparent;  
    border-image: url("http://...") 100% 0 repeat;
}