1

我知道这个问题已经被问过一百万次了，但每个解决方案似乎都有点不同，我似乎无法得到我读过的任何一篇文章来为我工作。

我正在构建一个支持 WooCommerce 的网站，并且在 Safari 中遇到图像边框半径问题。我对 CSS 很陌生，想象问题和解决方案的规模正在逃避我。由于这是一个很常见的问题，我将简短介绍。

这是布局：

  • 使用 Woothemes 设置我的商店
  • 我在商店中为我的拇指设置了图像边框半径
  • 它在 Firefox 中看起来很棒，在 Safari 中看起来很糟糕。
  • 我根本无法弄清楚如何使用我一直在阅读的解决方案使其工作。我敢肯定有一些简单的东西我还没有掌握。

这是商店的链接：http: //printologie.com/shop/ - 以及一个显示相同问题的产品页面：http: //printologie.com/shop/akuafoil-cards/

这是我的 custom.css 中的代码（简单的 -webkit 标记似乎无法修复它）：

ul.products li a img {
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #FFFFFF;
    border-radius: 80px 60px 80px 60px;
    box-shadow: 0 0 0 0 transparent;
    display: block;
    height: auto;
    margin-bottom: 0.75em;
    padding: 4%;
    width: 91%;
}

感谢您对修复程序的任何想法和解释。

4

1 回答 1

0

边框半径是一个 css3 属性。因此，如果您正在为您的项目使用，那么您必须添加所有供应商前缀。就像歌剧-o-、chrome 和 safari -webkit-、Firefox-moz-和 Microsoft一样-ms-。

所以你的财产看起来像：

-webkit-border-radius:80px 60px 80px 60px;
-moz-border-radius:80px 60px 80px 60px;
-o-border-radius:80px 60px 80px 60px;
-ms-border-radius:80px 60px 80px 60px;
border-radius:80px 60px 80px 60px;
于 2013-03-07T19:15:22.777 回答