在线运行代码 - 代码学院 www.codexy.cn

<!DOCTYPE html>
<html>
<head>
<style> 
div {
    background-color: lightgrey;
    border: 30px solid transparent;
    border-image: url('border.png');
    border-image-slice: 30;
    border-image-repeat: repeat;
}
</style>
</head>
<body>

<div>
 DIV 使用图像边框。
</div>
<p>使用的图片:</p>
<img src="border.png">

<p><b>注意: </b>Internet Explorer 10, Opera 12, 和 Safari 5 不支持 border-image-repeat 属性。</p>

</body>
</html>

源代码

动行结果