我想将边框图像的样式设置为与w3school示例相同：http : //www.w3schools.com/css/tryit.asp ? filename=trycss3_border-image 。
但是，当我在桌面上尝试使用https://jsfiddle.net/tangjeen/6yLtmb98/时，边框图像的结果并不相同。如果您能帮助我，将不胜感激。谢谢你。
<div class="row" id="round">
<p>sdfsfsdf</p>
</div>
#round{
-webkit-border-image: url(http://www.w3.org/TR/css3-background/border.png) 30 30 round; /* Safari 3.1-5 */
-o-border-image: url(http://www.w3.org/TR/css3-background/border.png) 30 30 round; /* Opera 11-12.1 */
border-image: url(http://www.w3.org/TR/css3-background/border.png) 30 30 round;
background-color: lightyellow;
}
确保border-width: 15px;/*your value*/和border-style: solid; /*needed for Firefox*/已设置。
还是速记方式border: 15px solid transparent;。还需要确保已设置BEFOREborder-image规则。
#round {
border-width: 15px;
border-style: solid;
border-image: url("https://i.imgur.com/BzbWBYA.png") 30 30 round;
background-color: lightyellow;
}<div id="round">
<p>hello world!</p>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句