CSS按鈕可以分為多種類型,比如原生按鈕、自定義按鈕、傾斜按鈕等等。其中,如何在按鈕上添加文字是一個比較基礎的問題。
首先,我們需要給按鈕設置寬度和高度,并設置邊框的樣式和顏色。
.button { width: 100px; height: 40px; border: solid 1px #ccc; }
接下來,我們需要設置按鈕上的文字樣式和顏色。
.button { width: 100px; height: 40px; border: solid 1px #ccc; font-size: 16px; color: #333; }
現在,我們已經完成按鈕的基礎樣式設置。接下來,我們需要在按鈕上添加文字。在HTML中,我們可以使用<button>標簽來創建按鈕。
在CSS中,我們可以使用text-align屬性控制文字的位置,使用line-height屬性控制文字的垂直居中。
.button { width: 100px; height: 40px; border: solid 1px #ccc; font-size: 16px; color: #333; text-align: center; line-height: 40px; }
這樣,我們就完成了一個簡單的CSS按鈕,并成功添加了文字。在實際項目中,我們可以繼續優化按鈕的樣式,比如添加漸變效果、改變鼠標懸停效果等等。