1、select
select箭头在各个浏览器显示不一致。为了达到统一性。就必须去掉默认样式,替换上自己的样式。代码如下:
所有主流浏览器都不支持 appearance 属性。
appearance对ie、opear浏览器不支持。-moz-appearance支持火狐,-webkit-appearance支持safari和谷歌;
对于select::-ms-expand{}只兼容到ie10。
2、placeholder
placeholder是h5的新属性,IE10以前的浏览器(8、9)不支持此属性。
第一种方法用插件jquery-placeholder,这是借鉴别人的。有点麻烦,先记着吧
注:此插件和jquery validate混合使用时,密码框password会略过校验,因为新生成的input并没有name属性。解决方法:点击提交按钮时,用js代码给新生成的input添加name属性。。。
3、opcaity
题外记录:opcaity属性是用来定义透明度的,其值在0-1.0之间。但IE8及其以下的版本并不支持。
在IE8上需用filter:alpha(opacity=?)来过滤,opacity的值在0-100间。
4、box-sizing
Internet Explorer、Opera 以及 Chrome 支持 box-sizing 属性。 Firefox 支持替代的 -moz-box-sizing 属性。
-moz-box-sizing:border-box;/* Firefox */
-webkit-box-sizing:border-box;/* Safari */
假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框,并把边框和内边距放入框中。
5、背景颜色rgba的兼容性
rgba对IE不兼容。那只能用滤镜 filter: progid: DXImageTransform.Microsoft.gradient(startcolorstr=#66000000, endcolorstr=#66000000);
这个颜色“#19ffffff”是由两部分组成的,第一部是#号后面的19,是rgba透明度0.1的IEfilter值。从0.1到0.9每个数字对应一个IEfilter值。对应关系如下:
第二部分是19后面的六位。这个是六进制的颜色值。要跟rgb函数中的取值相同。比如rgb(255,255,255)对应#ffffff;都是白色。到这里,rgba的用法就可以兼容IE8了。
网友评论