select樣式自定義
阿新 • • 發佈:2018-11-17
.search{ width: 25%;//定義最外層div的寬度 height:6rem; position: relative; background-image: url(/static/images/job/input.png);//設定div的背景圖片 background-repeat:no-repeat; background-size:100% 100%;//填充滿整個div position: relative; input{ width: 92%; height: 4.5rem; position: absolute;//input框定位到背景圖片上 top:0.7rem; left:0.5rem; border: 0px; outline:none; font-size:2rem; } } .area{ width: 25%; height:6rem; position: relative; background-image: url(/static/images/job/input.png); background-repeat:no-repeat; background-size:100% 100%; position: relative; select{ width: 92%; height: 4.5rem; position: absolute;//select框定位背景圖片上 top:0.7rem; left:0.5rem; border: 0px; outline:none;//去除點選的邊框效果 font-size:2rem; appearance:none;//去除向下箭頭 background: url(/static/images/job/right.png) no-repeat scroll right center transparent;//自定義向下箭頭 option { //option的樣式 } option:hover{//滑鼠懸浮option的樣式 } } }