代碼如下：

<div style="width:100px;height:50px;background-color:red;border-radius:15px;">

或者

<input type="button" value=" " style="border-radius:5px;" />

效果如下圖：

看了上述代碼是不是覺得非常簡單呢。其實html設置圓角矩形按鈕樣式關鍵之處，就是css中的border-radius
屬性。只要你掌握了這屬性的本質用法，那么無論給div還是圖片還是邊框按鈕設置圓角都可以輕松實現。

重點知識點介紹：border-radius 屬性是一個最多可指定四個 border -*- radius 屬性的復合屬性 這個屬性允許你為元素添加圓角邊框！

border-radius: 1-4 length|% / 1-4 length|%;

每個半徑的四個值的順序是：左上角，右上角，右下角，左下角。如果省略左下角，右上角是相同的。如果省略右下角，左上角是相同的。如果省略右上角，左上角是相同的。

那么本篇關于css按鈕設置圓角樣式的介紹，對有需要的朋友有所幫助。

以上就是css怎么實現按鈕圓角樣式的展示效果?（示例）的詳細內容，更多請關注php中文網其它相關文章！