1.如果图片加a标签在IE9-中会有边框
解决方案:
- 1 img{border:none;}
- 2.rgba不支持IE8
* 解决方案: * 可以用 opacity
eg:
- opacity:0.7;/FF chrome safari opera/ filter:alpha(opacity:70);/用了ie滤镜,可以兼容ie/
- display:inline-block ie6/7不支持 ### 解决方案: * display:inline-block;
- *display:inline;
4.img图片设置display:inline-block的时候。会产生间隙。
- 解决办法。1. 父级设置font-size:0;孩子设置自己相应的字体大小 2.将标签之间的空格删除 3.设置margin:-3px; 16.PIE.htc 可以实现很多css3属性在IE下的兼容性 如:圆角、阴影、渐变
(1) 圆角 border-radius
复制代码 .signBtn{ height: 40px; background-color:#08BCD2; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; behavior: url(css/PIE.htc); } 复制代码 (2)阴影 box-shadow
复制代码 .box{ width:200px; height:200px; -webkit-box-shadow:1px 0 10px; -moz-box-shadow:1px 0 10px; box-shadow: 1px 0 10px; background-color: #fff; behavior: url(css/PIE.htc);/IE边框阴影/ } 复制代码
(3)背景透明rgba
.box{ background-color:rgba(12, 154, 171, 0.29); behavior: url(css/PIE.htc); -pie-background:rgba(12, 154, 171, 0.29); } (4)渐变
复制代码 .box{ width:200px; height:400px; background:-webkit-gradient(linear, 0 0, 0 bottom, from(#9F9), to(#393)); background:-moz-linear-gradient(#9F9, #393); -pie-background:linear-gradient(#9F9, #393); behavior:url(pie.htc);
} 复制代码 注:PIE.htc文件路径相对是相对于css文件,并非html文件,以上例子是将PIE.htc文件放在与css样式文件同一个文件夹css内,而对应的html问价与css文件夹同级
17.JS实现点击跳转到指定位置
复制代码 ("#section").offset(); console.log(scroll_offset); $("body,html").animate({//如果只写body,只被chrome支持 只被chrome支持 Firefox和ie不支持 "scrollTop":scroll_offset.top },0);//此处0写上会一下跳转到指定位置,若不写会有过渡效果 /}); 复制代码