CSS中設(shè)置下拉框可以用到
/* 隱藏下拉箭頭 */
select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
/* IE */
background: transparent;
/* Chrome 三角形邊框顏色 */
border-color: #ccc;
/* 設(shè)置下拉框邊框和背景 */
border-radius: 0;
}
/* 設(shè)置下拉框的寬度和高度 */
select {
width: 200px;
height: 28px;
}
/* 設(shè)置下拉框的選項字體大小 */
option {
font-size: 16px;
}
/* 設(shè)置下拉框選項的背景色和字體顏色 */
option {
background: #fff;
color: #333;
}
/* 設(shè)置選中的下拉框選項的背景色和字體顏色 */
option:checked {
background: #333;
color: #fff;
}通過上面的樣式設(shè)置，可以讓我們的下拉框更加美觀、易于使用，提升用戶體驗。