CSS3按鈕的最佳實踐包括以下幾點:
<button>
元素創建按鈕,而不是使用<a>
或<div>
元素。這有助于提高代碼的可讀性和可訪問性。以下是一個簡單的CSS3按鈕示例:
<button class="btn">Click me</button>
.btn {
font-size: 16px;
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.btn:hover {
background-color: #0056b3;
}
在這個示例中,我們創建了一個具有基本樣式的按鈕,并使用CSS3過渡效果為其添加了鼠標懸停效果。當然,這只是一個簡單的示例,你可以根據自己的需求進行擴展和自定義。