记录遇到的IE8兼容性问题汇总

1，伪元素：first-child不起作用，需要单独指定样式名称

2，透明度表示方法，尤其在函数中表示

@mixin opacity($value) {
  -webkit-opacity: $value;
  -moz-opacity: $value;
  -ms-opacity: $value;
  -o-opacity: $value;
  filter: alpha(opacity=$value*100); //0~100的，所以这里需要*100
  opacity: $value;
}

3，input文字垂直居中，在IE8-之文字不默认垂直居中。解决：必须设置line-height

4，接文3：兼容了IE的文字不居中之后，打开Safari再看，placeholder竟然偏上了，经过查可知Safari不需要line-height，那么我们带上IE8的hack，“\9",ex:

input{
    height: 32px;
    line-height: 32px\9; //ie8的hack写法
}

5,transation在Safari浏览器中的bug

目标效果为：页面加载的时候登录框从页面底部飞入

css:

.login-form{
    position:aboslute;
    top:100%; 
    transation:top .6s ease:
}

js:

$(".login-form").css("top","200px");

Safari浏览器根本就不认识”top：100%"卧槽了，必须给定一个具体的值，或者说使用js去将login-form的top初始值给设定好

6，IE8的背景图片设置：

background: url("../images/box_check_bg.png") no-repeat !important;

如果属性值加上！important的话IE8会加上两层背景图片，一层是设置background-size之前的，一张是加了background-size之后的，所以这里要注意去掉