遇到的兼容性bug

1.（IE6）：ie6環境下，經過設置z-index：999；無效果；

緣由：IE6下，決定層級高低的不是當前的父標籤，而是整個DOM tree（節點樹）的第一個relative屬性的父標籤。

解決辦法：找到DOMtree裏面全部設置了relative屬性的父標籤，依次遞增設置z-index；

 

 

2.（IE6）：ie6環境下，input輸入款光標上下不居中；

解決辦法：給input一個小一點的height，而後用padding上下補白控制input的高度大小；

 

3.（IE8）：input text  裏面用text-indent失效；

解決辦法，將text-indent：30px；換成padding-left：30px；

 

4.（IE8/IE9）：placeholder是css3屬性，不支持；

解決辦法：使用js設置value值；

<input type="text" onblur="if (this.value == '') {this.value = 'Search';}" onfocus="if (this.value == 'Search') {this.value = '';}" value="Search" >

　　

 5.placeholder更改顏色：

須要考慮各類瀏覽器兼容性；

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #636363;
}
input:-moz-placeholder, textarea:-moz-placeholder {
  color: #636363;
}

　　

 6.（IE8）：半透明部分設置樣式：opacity:0.7在ie9/ie10/ff/chrome/opera/safari顯示正常，是圖上的效果。可是這樣在ie6-ie8中是不支持的，須要加上下面這句話：

解決辦法：

filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);