文章/答案/技术大牛

发布

社区首页 >问答首页 >CSS3的智能方法

问CSS3的智能方法
EN

Stack Overflow用户

提问于 2010-06-22 10:59:54

回答 2查看 221关注 0票数 1

您是否有任何优雅的方法可以从CSS3特性中获益，比如边界半径或渐变？

我正在寻找一种解决方案，以避免浏览器特定的CSS属性和浏览器特定的样式表文件。我发现它们既难以维护，又过于冗长。

它可能是一个Javascript库，负责跨浏览器兼容。因此，我可以只使用W3C CSS3属性支持(不支持浏览器)，并在浏览器启动tu支持CSS3时摆脱库。

到目前为止，我发现这些资源似乎至少满足了我的一些期望：

eCSStender - JS被告知在不同浏览器上模仿(甚至IE6)上的CSS3特性，但是我还没有进行测试(阅读关于eCSStender的文章)
摩德尼泽 - JS 检测浏览器支持的哪些CSS3属性
..。我会用你的回答

或者您可能有其他方法可以让您在没有非常冗长的代码的情况下利用CSS3？

coding-style

cross-browser

css

回答 2

Stack Overflow用户

回答已采纳

发布于 2010-06-22 11:31:38

您可以使用较少，它的主页上有一个边框半径示例：

.rounded_corners (@radius: 5px) {
    -moz-border-radius: @radius;
    -webkit-border-radius: @radius;
    border-radius: @radius;
}
#header {
    .rounded_corners;
}

然而，我真的不觉得使用浏览器前缀那么麻烦。对于一个border-radius，唯一需要的是：

-webkit-border-radius: 5px;
   -moz-border-radius: 5px;
        border-radius: 5px;

这将在大约十几个浏览器中工作(如果你包括移动浏览器)。以这种方式使用缩进还可以使您更容易忘记更新属性之一。当您决定放弃支持Safari 4或其他任何东西时，您可以简单地搜索并替换您想要从CSS文件中删除的规则。

将其与我们需要的盒子模型黑客、NS4、IE5/Mac修补程序以及所有这些垃圾进行比较。

票数 1

Stack Overflow用户

发布于 2010-06-22 11:34:02

这并不是CSS3特有的，但是当您要求一种简洁的方法来处理样式并提到现代化(如果没有该特性的话，可以将no-borderradius这样的classes添加到<html>元素中来工作)，我认为它可能有助于组织您的CSS的一般改进方法。

较少允许在CSS中使用变量、混合或嵌套规则(有关示例，请参阅链接)。但是，这需要将.less文件编译为有效的.css。为了避免这种情况，存在/将是less.js (另请参阅：Less.js将淘汰CSS)，它允许您将.less文件直接包含在页面中(至少在开发过程中是有用的)。

我认为更少并不需要你学习很多新的语法规则，并且可能有助于在“真实”风格旁边组织回退CSS。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/3092426

复制

相似问题

问CSS3的智能方法
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS3的智能方法EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS3的智能方法
EN