我遇到了Safari 10和CSS边框图像渐变的问题。它适用于所有其他浏览器,甚至在Safari 9中。它甚至可以在Safari 10在线模拟器中显示。请参阅下图:CSS边框图像渐变不适用于Safari 10
(我想这是IE 11,而不是IE 10.感谢您的指正!)
我以为这只是我的CSS所以我真的simplfied它,并提出了小提琴。你可以在https://jsfiddle.net/tgbuxkee/
上看到它也在下面生成。
div {
width: 200px;
height: 200px;
border: 6px solid transparent;
-moz-border-image: -moz-linear-gradient(top, #f0e2d0 0%, #c08b62 100%);
-webkit-border-image: -webkit-linear-gradient(top, #f0e2d0 0%, #c08b62 100%);
border-image: linear-gradient(to bottom, #f0e2d0 0%, #c08b62 100%);
-webkit-border-image-slice: 2;
border-image-slice: 2;
}
<div>
</div>
没有任何人有任何想法,为什么这可能发生?我知道有一个bug在Safari中有一些图像边界,但我不认为这是这种情况(也许是这样)。
而指导是有帮助的。
谢谢。
我已经在过去看到过这个,但我不是100%确定它仍然可以工作(所以还没有发布答案)。而不是'border:6px solid transparent';试试设置'border-width:6px; border-style:solid;'(no'border-color')和过去常用的工具。它也适用于其他浏览器,因为图像会覆盖颜色。 – Harry