使用Html和css的div標籤的邊緣曲線

Question

是否有可能使用html和css僅將div的曲線邊緣...不使用圖像。

Answer 1

我假設你是指邊界半徑。是的，它可以在適當的瀏覽器（不是IE）中使用border-radius。因爲它是一個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 2

是的，這是可能的，但它是CSS 3功能，可能無法在所有瀏覽器上使用（或在所有瀏覽器中不一樣）。一個例子見this article。

Answer 3

不以一種兼容跨瀏覽器的方式（特別是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 4

是的，它當然是技術上可行的（我猜可能是最好的一種），here就是一個例子（一定要檢查源代碼，它確實是一種很酷的技術）。