表單輸入框是Web開(kāi)發(fā)中常見(jiàn)的元素,通過(guò)CSS樣式的調(diào)整可以讓表單輸入框更加美觀、易用。以下是一些常用的表單輸入框CSS樣式:
/* 輸入框的基本樣式 */ input[type="text"],input[type="password"],textarea{ padding:8px 10px; border:1px solid #ccc; border-radius:4px; outline:none; font-size:14px; } /* 輸入框獲得焦點(diǎn)時(shí)邊框和背景色的變化樣式 */ input[type="text"]:focus,input[type="password"]:focus,textarea:focus{ border:1px solid #1e87f0; background-color:#f8f8f8; } /* 輸入框的禁用樣式 */ input[type="text"]:disabled,input[type="password"]:disabled,textarea:disabled{ background-color:#f2f2f2; color:#9e9e9e; cursor:not-allowed; }
通過(guò)以上樣式的調(diào)整,可以使表單輸入框更加清爽美觀、易用。需要注意的是,在應(yīng)用樣式時(shí),要兼顧用戶體驗(yàn)和網(wǎng)站整體風(fēng)格。