不常见的CSS

border-image

        #box{
            width: 300px;
            height: 300px;
            margin: 100px auto;
            background-color: orange;
            /*注意:给div设置一个透明的border,否则显示会出现问题*/
            border: 1px solid transparent;
            /*图片路径*/
            border-image-source: url(img/border.png);
            /*图片边框向内偏移,用来分解引用的图片,拆分成九宫格*/
            border-image-slice: 26 26 26 26;
            /*图片边框的宽度*/
            border-image-width: 30px;
            /*边框是否平铺(repeated) 铺满(round)拉伸(strech)*/
            border-image-repeat: round;
        }
不常见的CSS_第1张图片
Paste_Image.png

你可能感兴趣的:(不常见的CSS)