3

我有兴趣在-webkit-line-clamp混合 iOS 应用程序中使用。

我已阅读有关不受支持的属性的苹果文档。

使用不受支持的属性是否明智，或者我是否冒着在移动 safari 和其他浏览器实现中的 webkit 未来实现中删除该功能的风险？

如何检查 WebKit 属性的状态？

4

2 回答 2

4

只要缺乏对-webkit-line-clamp(ala border-radius) 支持的浏览器仍然可以访问该设计，就没有什么影响可言。

浏览器过去是否更改了它们的实现或放弃了对实验性属性的支持？当然。

  • Safari 最初的渐变实现与当前标准完全不同
  • WebKit 浏览器仍然支持 prefixedcolumn-break-before属性，break-before在当前标准中被重命名为
  • WebKit 浏览器仍然支持 2009 年 Flexbox 草案中的属性，尽管在 2012 年末进行了彻底改革

值得庆幸的是，您可以以在支持旧实现和新实现的浏览器中工作的方式编写 CSS：

.foo {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
}

将来，我们将可以访问功能查询来检测浏览器是否支持特定属性（Opera 现在支持，Firefox很快就会支持： http: //caniuse.com/#feat=css-featurequeries）

@supports not (-webkit-line-clamp: somevalue) {
    // some styles for unsupported browsers
}
于 2013-04-10T00:41:38.000 回答
2

Chris Coyer 写了一篇关于这个主题的文章：http ://css-tricks.com/line-clampin/ FTLabs 为此创建了一个 JS-Plugin：FTEllipsis他们将它用于新的金融时报 iPad webapp - 看看http ://coding.smashingmagazine.com/2013/05/23/building-the-new-financial-times-web-app/

于 2013-06-03T10:09:56.300 回答