编程狮在线代码实例

Tab
<>
""
''
()
{}
[]
/
:
;
?
,
.
$
输入
运行
xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>W3Cschool教程(w3cschool.cn)</title> 
<style type="text/css"> 
div
{
  border-width:15px;
  width:250px;
  padding:10px 20px;
}
​
#round
{
  -moz-border-image:url("/statics/images/border.png") 30 30 round; 
  -webkit-border-image:url("/statics/images/border.png") 30 30 round; 
  -o-border-image:url("/statics/images/border.png") 30 30 round; 
  border-image:url("/statics/images/border.png") 30 30 round;
}
​
#stretch
{
  -moz-border-image:url("/statics/images/border.png") 30 30 stretch; 
  -webkit-border-image:url("/statics/images/border.png") 30 30 stretch; 
  -o-border-image:url("/statics/images/border.png") 30 30 stretch; 
  border-image:url("/statics/images/border.png") 30 30 stretch;
}
</style>
</head>
<body>
​
<p><b>注意:</b> Internet Explorer 不支持 border-image 属性。</p>
<p>border-image 属性用于指定一个边框的图像。</p>
​
<div id="round">在这里，图像平铺（重复），以填补该地区。</div>
<br />
<div id="stretch">在这里，图像被拉伸以填补该地区。</div>
​
<p>下面是使用图像:</p>
<img src="https://7n.w3cschool.cn/attachments/knowledge/201611/31824.png" />
​
</body>
</html>
实例代码
运行结果