<!DOCTYPE html>
<html>
<head>
<style>
div { background-color: lightgrey;
border: 30px solid transparent;
border-image: url('border.png') 30 30 30 30 1 1 1 1 0 stretch;}
</style>
</head>
<body>
<div id="main">
<p>
这是一个使用图像作为边框的 DIV 元素。
</p>
</div>
<p>单击“试一试”按钮将 borderImageRepeat 属性的值设置为“round”。</p>
<button onclick="myFunction()">试一试</button>
<script>
function myFunction() { document.getElementById("main").style.borderImageRepeat = "round";}
</script>
<p><b>注意：</b>Internet Explorer 10 及更早版本不支持此属性。</p>
</body>
</html>