CSS 中的 border-radius 屬性可以實現圓滑按鈕的效果。這個屬性可以指定元素的邊框角的半徑大小,以像素為單位。
.button { background-color: #4CAF50; border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer; border-radius: 25px; }
在上面的代碼片段中,我們使用了 border-radius 屬性來指定按鈕的圓角大小。25px 的半徑大小足以讓按鈕變得圓滑。
注意,這里還使用了其他的樣式屬性,如背景顏色、邊框、顏色、內邊距、文本對齊方式等等。這些屬性可以根據需求進行調整。
使用圓滑按鈕的好處是,它們可以使網站看起來更加現代、簡潔,也更加易于操作。削弱了元素的角和邊緣,使其變得更加和諧、流暢。
因此,在設計網站時,圓滑按鈕是一個非常有用的工具,可以提高用戶體驗,讓網站更加引人注目。
上一篇css實現文字點點點動畫
下一篇html和css先學