造型不規則形狀的按鈕

Question

是否可以創建一個不規則形狀的按鈕。

我的按鈕有以下css，它使它成爲一個簡單的矩形。

.btnclass { 
    width:100; 
    height:40; 
} 

，但它想使看起來更像是這樣的：

​​

任何巧妙的構思與CSS來實現這一目標？

Answer 1

我不認爲你可以，你最好使用真實形狀的圖像，只要你想

Answer 2

不是真的沒有了一堆CSS兩輪牛車的，最好的辦法是使用圖像。

如果你試圖爲表單按鈕這樣做看看使用以下

<input type="image" src="image_path.png" alt="image description" /> 

Answer 3

圍棋與圖像按鈕。 <input type="image" ... />或<button><img src="" /></button>如果不是，下面的建議不是最佳的，但這是因爲圖像可能是最優的解決方案。

1. 設置具有所需形狀的背景圖像。我認爲這是最純粹的解決方案，所以要這樣做。 background-image: url(whole-image.png);

2. 設置背景顏色和位於右上角的小背景圖像。解決方案類似於那裏的「圓角黑客」。 background: #<button-color> url(small-image.png) top right no-repeat;