huanghuang 2017-10-09
<script language="JavaScript"> <!-- function getOs() { var OsObject = ""; if(navigator.userAgent.indexOf("MSIE")>0) { return "MSIE"; } if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){ return "Firefox"; } if(isSafari=navigator.userAgent.indexOf("Safari")>0) { return "Safari"; } if(isCamino=navigator.userAgent.indexOf("Camino")>0){ return "Camino"; } if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){ return "Gecko"; } } alert("您的浏览器类型为:"+getOs()); --> </script>
*、真的有用,在相应的浏览器版本中写下指定样式即可。
.test{ /* 1. */ /* color:#09F\0; 以前是IE8/9, 现在10也支持 */ color:#09F\0/; /* 以前是IE8 only, 现在IE9/10也支持. 如要排除IE9需要使用下面的rule重设IE9样式 */ } @media all and (min-width:0) { /* 2. */ .test{color:red\9; }/* IE9 only, 现在IE10也支持 */ /* Ps:老外的方法都是\0,根本没考虑Opera */ } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* 3. */ .test { color: green; } /* IE10+ */ } :root .test { color:#963\9; } /* 以前IE9 only, 现在10也支持, 优先级高于@media, 优先级太高, 尽量少用 */ *background-color:#00f;/*ie7*/ _background-color:#ff0;/*ie6*/
*、select在IE下去除箭头样式
/*清除ie的默认选择框样式清除,隐藏下拉箭头(但仅支持IE10+,其他低版本还需要下点功夫克服)*/ select::-ms-expand { display: none; } 引自:http://blog.csdn.net/duofx/article/details/53009613
*、chrome 调试移动web时字体被放大?
添加-webkit-text-size-adjust:none;即可 但手机端依旧有问题,但PC端的移动模拟已正常 无奈,需要继续深挖··· 引自:https://segmentfault.com/q/1010000004139245?_ea=509215
*、IE7下层的摆放有交叉,是因为z-index应用不当,一定要将该属性置于最外层(父元素)
最外层的父元素 引自:http://www.neirong.org/post-313.html 另外IE7不支持height:1%,这种百分比的写法,切记切记
*、判断浏览器版本及其类别尤其是360
//测试mime function _mime(option, value) { var mimeTypes = navigator.mimeTypes; for (var mt in mimeTypes) { if (mimeTypes[mt][option] == value) { return true; } } return false; } //调用该方法即可 function is360() { var isChrome = navigator.userAgent.indexOf("Chrome") > -1?true:false; var is360 = false; if(window.navigator.userAgent.indexOf('Chrome')!=-1){ is360 = _mime("type", "application/vnd.chromium.remoting-viewer"); if (isChrome && is360) { is360 = true; isChrome = false; } } return is360; }
*、判断浏览器类型