CSS是前端開發(fā)中常用的樣式表語言,通過CSS可以改變網(wǎng)站的字體、顏色、大小、布局等。在網(wǎng)站設(shè)計(jì)中,表單是一個(gè)比較重要的元素,而表單中的提交按鈕更是不可或缺的。CSS可以幫助我們優(yōu)化提交按鈕的樣式從而讓它更加美觀并且符合網(wǎng)站的風(fēng)格。
/*普通按鈕樣式*/ input[type="submit"]{ display:inline-block; padding:10px 20px; margin:20px 0; background-color:#4CAF50;/*背景顏色*/ color:white;/*字體顏色*/ border-radius:5px;/*邊框圓角*/ border:none;/*去除默認(rèn)邊框*/ font-size:16px;/*字體大小*/ } /*鼠標(biāo)懸停樣式*/ input[type="submit"]:hover{ background-color:#3e8e41; color:#fff; } /*按下狀態(tài)樣式*/ input[type="submit"]:active{ background-color:#3e8e41; color:#fff; }
這段CSS樣式代碼中我們?yōu)閕nput標(biāo)簽的提交按鈕設(shè)置了背景顏色、字體顏色、內(nèi)邊距、外邊距、 給按鈕添加了圓角邊框,并且去除了默認(rèn)邊框和外陰影。接下來,我們?yōu)槭髽?biāo)懸停和按下按鈕的狀態(tài)分別設(shè)置樣式。鼠標(biāo)懸停時(shí)按鈕顏色會(huì)變深,并且字體顏色變?yōu)榘咨.?dāng)按下按鈕時(shí)樣式會(huì)再次改變,這樣可以給用戶更好的點(diǎn)擊體驗(yàn)。
以上就是關(guān)于CSS提交鍵樣式的簡(jiǎn)單介紹,CSS提交鍵樣式可以通過CSS來自定義,這里只介紹了其中一種常見的樣式,如果想要更豐富的樣式,您可以在此基礎(chǔ)上進(jìn)行擴(kuò)展。