Question

是否可以仅使用html和css将曲线边缘带到div ...而不使用图像。

Answer 1

不是兼容的跨浏览器（特别是IE还不支持它）。在CSS 3中，您可以使用border-radius，其中Safari和Firefox目前支持-webkit-border-radius和-moz-border-radius。例如

<div style="-moz-border-radius: 10px; 
            -webkit-border-radius: 10px;
            border-radius: 10px;
            border: 1px solid #000; 
            padding: 10px;">
  This is a sample div.
</div>

Answer 2

是的，这是可能的，但它是一个CSS 3功能，可能不适用于所有浏览器（或在所有浏览器中都不一样）。有关示例，请参阅this article。

Answer 3

我假设你的意思是border-radius。是的，可以在border-radius的适当浏览器（不是IE）中使用。因为它是一个CSS3属性，它还没有正确实现，你需要做一些技巧才能使它工作：

-moz-border-radius: 10px; /* for firefox */
-webkit-border-radius: 10px; /* for safari & chrome */
border-radius: 10px; /* for others (opera) */

请查看http://www.css3.info/preview/rounded-border/了解详情。

Answer 4

是的，当然，它在技术上是可行的（我猜是最好的可能），here就是一个例子（一定要查看源代码，它确实是一种很酷的技术）。

使用Html和css标记div标签的曲线

4 个答案: