我刚刚注意到,Stack Overflow在首页上使用Firefox only CSS来圆角用户徽章。这是一个有趣的想法,但使用Firefox only CSS会有什么优缺点(除了明显的优点)?
-moz-border-radius:6px;
-webkit-border-radius:6px;
上面是在 Stack Overflow 首页上用于圆角的 CSS。
我刚刚注意到,Stack Overflow在首页上使用Firefox only CSS来圆角用户徽章。这是一个有趣的想法,但使用Firefox only CSS会有什么优缺点(除了明显的优点)?
-moz-border-radius:6px;
-webkit-border-radius:6px;
我认为主要问题在于您的CSS无法验证。除此之外,我认为使用这种特定于平台的功能没有任何问题,因为它们不会对那些不支持该功能的浏览器的用户造成任何伤害。
我同意BeefTurkey的观点。
我甚至可以进一步称之为使用CSS进行渐进增强的一个案例。借用理解渐进增强中的话,我认为圆角是巧克力花生糖包裹外面的彩色糖衣。
最终,CSS3将被批准,border-radius将被标准化。可以删除带有-moz、-webkit和-ms前缀的样式,并用它们的标准等效物替换。你的CSS将验证通过,那些不支持CSS3的浏览器的用户将仍然拥有完全可接受的体验,而使用支持CSS3的浏览器的人将获得一个更好的体验。
或者,你可以继续使用专有的CSS,以及任何标准,为更大的受众提供更好的体验。这将取决于维护所有CSS所需的努力程度以及你认为增强体验对你的受众有多重要。
它适用于Firefox和基于Webkit的浏览器(尤其是Safari和Chrome)。IE或Opera没有替代品。
使用它的主要原因是当您想要为显示在具有图案化或不可预测背景上的元素提供圆角时,否则不可能实现。正常的CSS和图像可以处理其他情况。
它也非常容易实施,并且肯定对这个网站上的一半以上的人有效。
缺点当然是它不受其他浏览器支持,也不在W3C规范中。
当前的实现很糟糕(无论是在Firefox还是Webkit中),因为它们不共享语法。