0

我正在考虑只使用 div 创建一个定制的圆角块，我很想知道你们的想法，如果这是一个足够好的方法，或者是否有更简单的方法来获得跨浏览器支持（同时也支持较旧的浏览器，例如 IE6)

我会写一个简单的解释代码让大家容易理解：

<div class="Block" style="position:relative">
    <div>
    Content will go here or something
    </div>
    <div name="TopLeft" style="position:absolute;top:0;left:0;"></div>
    <div name="TopRight" style="position:absolute;top:0;right:0;"></div>
    <div name="BottomLeft" style="position:absolute;bottom:0;left:0;"></div>
    <div name="BottomRight" style="position:absolute;bottom:0;right:0;"></div>
</div>

在真正的代码中，我会给他们每个人一个背景，当然把它放在一个css文件中，而不是像这样内联写它。

4

5 回答 5

2

使用CSS3Pie。

这是 IE 的 Javascript hack，它border-radius在旧版本的 IE 中实现 CSS。

于 2012-08-27T13:50:14.660 回答
1

如果你需要在 IE6-9 浏览器中使用圆角，你只需要使用 CSS3border-radius和一个PIE.htc文件

渐进式 Internet Explorer

div{ border-radius: 6px; -moz-border-radius: 6px; behavior: url(PIE.htc); }

这在所有 IE 浏览器中效果最好

于 2012-08-27T13:49:26.487 回答
1

是的，这会很好。

您还可以使用脚本添加元素，这将使标记更清晰。我在这里使用这种方法：bytbil.com

于 2012-08-27T13:52:39.167 回答
0

怀疑它会在 IE6 中工作，但您可以使用以下内容：

-moz-border-radius: 15px;
border-radius: 15px;

把它放在你的 DIV 的 CSS 中，它将支持大多数浏览器，但同样，不确定 IE6...它确实适用于 IE9、Safari (5+)、FireFox(1.0+)、Chrome(5+) 和歌剧（10.5+）...

于 2012-08-27T13:48:29.253 回答
0

我想这会行得通，它和支持 IE6 一样好。

任何涵盖 IE6 的解决方案都注定是一个可怕的 hack。我认为怀疑你是否真的需要它真的很值得。我宁愿只使用 css 圆角，让芯片落在可能的地方。

于 2012-08-27T13:55:19.207 回答