主要針對右邊的箭頭進行優化,因為不同的瀏覽器默認的右邊的箭頭不一樣,但是ie9不支持 appearance:none;,所以ie9以及以下版本就用js寫一下,不優化,使用默認的樣式 html頁面代碼:
<select> <option>選項1</option> <option>選項2</option> <option>選項3</option> </select>CSS樣式:
select { border: solid 1px #000; appearance:none; -moz-appearance:none; -webkit-appearance:none; padding-right: 14px; background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent; /* background:white/9/0;*/}select::-ms-expand { display: none; background: none;} /*去除ie瀏覽器默認的select樣式*/js代碼:
if(navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion .split(";")[1].replace(/[ ]/g,"")=="MSIE9.0") { $("select").css("background","none"); }頁面實現的最終樣式新聞熱點
疑難解答