html - CSS - 新的 Firefox 版本不再显示边框图像

Question

Firefox 更新后，边框图像不再显示？你可能已经定义了这样的东西：

border-width:30px;
-moz-border-image: url('border.png') 64 64 64 64 stretch stretch;
   -webkit-border-image: url('border.png') 64 64 64 64 stretch stretch;
   -o-border-image: url('border.png') 64 64 64 64 stretch stretch;

Answer 1

我不得不环顾四周才意识到这是一个 Firefox 问题。首先，我认为 AdBlock 可能只是出于某种原因阻止了它。这实际上是 Mozilla 对他们的 CSS 解释所做的改变。您现在必须在其下方添加此属性才能使其工作：

border-style:solid;

希望我能帮上忙。

Answer 2

根据规范，需要border-image-width设置 Firefox。

只需包括上述属性。

在这里，border-style将纠正问题，但为了更加合乎逻辑和相关，最好使用它来border-image-width代替border-style或border-width有时使用。

Answer 3

考虑添加：

border: 15px solid transparent;

15px 只是一个例子。

Answer 4

添加fill：

-webkit-border-image: url(<%= asset_path('wxskvip_head_frame.png') %>) 6 fill stretch;