替代盒装饰中断

是否有任何替代盒装饰中断的IE浏览器？替代盒装饰中断

我的客户需要IE的工作解决方案，但IE不支持。

.class1 { 
 
    display: inline; 
 
    padding: 32px 20px 16px; 
 
    margin-left: -20px; 
 
    background-color: #000; 
 
    -webkit-box-decoration-break: clone; 
 
    -o-box-decoration-break: clone; 
 
    box-decoration-break: clone; 
 
} 
 

 
.class2 { 
 
    color: #fff; 
 
    display: inline; 
 
    position: relative; 
 
    z-index: 40; 
 
    padding: 0; 
 
}

<span class="class1"> 
 
    <h1 class="class2">Lorem Ipsum Ipsum</h1> 
 
</span>

来源

2017-08-09 Okami Okami

您可以添加您的相关HTML来重现所需的行为吗？ –

添加代码，感谢您的注意我 –

说实话，我没有看到任何使用您的代码的特殊效果。只是在黑色背景上的白色文本。将您的HTML和CSS移动到代码片段，随意编辑它。 –

你试过

-ms-box-decoration-break: clone;

这种联系表明它支持所有版本的IE： https://www.quackit.com/css/css3/properties/css_box-decoration-break.cfm

来源

2017-08-09 10:48:46

不幸的是，它不工作，所以即时寻找其他解决方案 –

IE浏览器不支持盒装饰断特性。你需要使用一个polyfill。检查这个链接，它是一个盒装饰中断的polyfill，它可以帮助你。 https://github.com/entepe85/decofill

来源

2017-08-10 06:34:01 Justin

我检查了decofill，但它看起来不适合我，但我发现很好快速解决我的问题，所以仍然感谢你们所有人;） –

你能分享吗？ – Justin

替代盒装饰中断

回答

相关问题