CSS是一種很強大的網頁樣式設計語言,利用它可以輕松地制作出精美的按鈕。下面就讓我們來看看如何利用CSS制作一個好看的按鈕。
.button{ background-color: #4285F4; border: none; color: white; padding: 10px 20px; text-align: center; text-decoration: none; font-size: 16px; margin: 4px 2px; cursor: pointer; border-radius: 5px; }
首先,我們需要創建一個類名為"button"的樣式,用來設置按鈕的基本樣式。
background-color設置按鈕的背景顏色,此處為#4285F4,即藍色;
border設置按鈕的邊框,此處設置為none表示無邊框;
color設置按鈕的字體顏色,此處為白色;
padding設置按鈕的內邊距,使按鈕的文字與邊框有一定的距離;
text-align設置按鈕文字的對齊方式,此處為中心對齊;
text-decoration設置按鈕文字的裝飾效果,此處為無;
font-size設置按鈕文字的大小,此處為16px;
margin設置按鈕的外邊距,使其與其他元素有一定距離;
cursor設置鼠標移到按鈕上時的光標類型,此處為手型光標;
border-radius設置按鈕的圓角,讓按鈕看起來更加美觀。
將以上代碼應用到HTML文件中的按鈕元素中,就可以制作出一個非常好看的按鈕了。