主要針對(duì)右邊的箭頭進(jìn)行優(yōu)化,因?yàn)椴煌臑g覽器默認(rèn)的右邊的箭頭不一樣,但是ie9不支持 appearance:none;,所以ie9以及以下版本就用js寫一下,不優(yōu)化,使用默認(rèn)的樣式 html頁面代碼:
<select> <option>選項(xiàng)1</option> <option>選項(xiàng)2</option> <option>選項(xiàng)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瀏覽器默認(rèn)的select樣式*/js代碼:
if(navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion .split(";")[1].replace(/[ ]/g,"")=="MSIE9.0") { $("select").css("background","none"); }頁面實(shí)現(xiàn)的最終樣式新聞熱點(diǎn)
疑難解答
圖片精選