【轉】瀏覽器兼容性問題彙總

瀏覽器兼容性問題彙總

1：margin-left在IE6不生效(復現條件：塊狀元素、浮動、margin-left) ---------解決方法：http://www.seostudying.com/1233.html

 

2: position:fixed 在ie6 、ie7(quirk) 、 ie8(quirk)下被當成錯誤處理。-----------解決方法：http://blog.sina.com.cn/s/blog_106f3d140100yaok.html

　　解決思路：用 _position：absolute替代------>CSS HACK（expression）+margin ---------->防抖動處理 *html{background-image:url(about:blank); background-attachment:fixed;}

 

3:scrollTop 在FF chrome返回值爲零 ------------解決方法：http://www.jb51.net/article/64328.htm

完美寫法：var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

 

4：var ev = ev || window.event;

 

5:CSS3新屬性background-size在IE六、七、8下兼容解決辦法---------http://www.tuicool.com/articles/Vrq2Q3B

　　過濾器filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='11.gif', sizingMethod='scale');

6：透明兼容IE8- -------------------------------opacity / rgba

　　opacity: 0.5; filter:Alpha(opacity:50);

　　rgba(0,0,0,0.5);----------ie9+

　filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#7F000000,endColorStr=#7F000000)-------------ie9-

　　a:0.5 -------------> b:7F a*255------>16進制轉換

　　:root selector{filter:none\9 !important}------------------->/*ie9 hack*/

 

7：僞類visited在現代瀏覽器不兼容 -------------------------------https://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-vistited/

（CSS屬性不兼容的話，不如用js兼容性更好）

 

8：js中獲取子元素第一個節點

　　firstChild-------IE8-正常;IE9+會把空格引發的文本節點#text解析出來

　　firstElementChild------IE9+兼容;IE8-爲undefined不報錯

　　異或寫法---------var first = ul_dom.firstElementChild || ul_dom.firstChild;

　　創統寫法---------var first = ul_dom.children[0];

 

9：句號在某些機型可能不在文字右下角問題

　　　　font-style: normal; font-family: SimSun;

 

10：ie6下浮動元素雙倍外間距--------------------http://blog.csdn.net/sinat_16411539/article/details/50582090

　　　　浮動元素加 display: inline;

 

11：連續a標籤默認間距-----------------http://www.cnblogs.com/kevinCoder/p/6418605.html

　　父元素font-size:0（推薦）;

　　　　a標籤寫在一行-----------當行內元素之間有「回車」、「tab」、「空格」時就會出現間隙

 

12：img與父元素底部默認間距----------------http://www.cnblogs.com/lovelyun/p/4846222.html

　　塊級元素包含內聯元素如圖片文字等時，內聯元素默認是和父級元素的baseline（基線）對齊的，而baseline又和父級元素底邊有必定的距離（這個距離和font有關）

　　　　父元素font-size:0 或者 vertical-align:bottom

 

13：IE6下 a元素添加onclick事件----------------http://www.3lian.com/edu/2014/09-16/165905.html

　　onclick事件執行後冒泡到href是裏的javascript:void(0); onclick處理函數內return false 阻止冒泡，或者去掉改變href。

 

14：輸入框光標垂直居中line-height法不生效-----------------http://www.cnblogs.com/enmeen/p/5587825.html

　　去掉line-height使用其餘垂直居中方法便可