關於火狐IE瀏覽器select樣式問題
阿新 • • 發佈:2018-12-10
1.可用:
<style type="text/css"> select { /*Chrome和Firefox裡面的邊框是不一樣的,所以複寫了一下*/ border: solid 1px #000; /*很關鍵:將預設的select選擇框樣式清除*/ appearance:none; -moz-appearance:none; -webkit-appearance:none; /*在選擇框的最右側中間顯示小箭頭圖片*/ background: url('../static/img/arrow.png') no-repeat scroll right center transparent !important; /*為下拉小箭頭留出一點位置,避免被文字覆蓋*/ padding-right: 14px; } /*清除ie的預設選擇框樣式清除,隱藏下拉箭頭*/ select::-ms-expand { display: none; } </style>
(失敗的話加!important 試試)
2.或 直接在div中寫style:
style="height: 40px; border: 1px solid #e5e6e7; appearance:none; -moz-appearance:none; -webkit-appearance:none; padding-right: 14px; background: url('../static/img/arrow.png') no-repeat scroll right center transparent; ::-ms-expand { display: none;} "