0411-39943997
工作時間:周一至周日 8:30-22:00
前端技術
News and information

IE11的CSS兼容性解決方法

標簽:CSS兼容性瀏覽次數:?? 時間:2017-11-23

IE11的CSS兼容性解決方法

早上一開機打開微信電腦版,客戶就發了一個網頁bug,如圖

image.png

我一看肯定是在ie瀏覽器里出現的問題,于是打開IE11測試果然沒錯,然后到網上搜索關于IE11hack兼容性解決方法,一搜索果然有,于是根據此方法改了一下CSS TOP高度就解決了

 就是在CSS樣式文件中加一個@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none){里面是你的樣式}。

  比如,我在chrome瀏覽器中給一個div設置樣式

  div{

    padding:0 12px;

  }

  那么,在IE11中想要實現上面效果,需要在這個下面再添加一行樣式  

  div{

    padding:0 12px;

  }

  @media screen and(-ms-high-contrast:active),(-ms-high-contrast:none) {

    div{padding:0 6px;}

  }

  這里需要注意一下IE11的樣式要寫在最后面防止被覆蓋,當瀏覽器為IE11時,@media中的樣式會被執行一遍。

  還有一個就是IE11針對h5的表單驗證部分,驗證失敗后input標簽會出現一個紅色的框,比較丑。這個時候你只要針對專門的input標簽,增加一個input{outline:none};就可以將紅色的邊框去掉了。

 

 

2016/01/15更新

  今天大拿直接一行代碼把我之前的IE11兼容性問題全解決了。不服不行。小伙伴們下次遇到兼容性問題記得先加上這行代碼試試,不行再按照上面的方法來吧TAT,貼出代碼

    

    * {
      box-sizing: content-box;
      -moz-box-sizing: inherit;
      -webkit-box-sizing: inherit;
     }



本文地址:http://www.425555c.com/front/20171123473.html
Copyright? 2011 仟億科技,All rights reserved.
首頁關于我們新聞資訊服務項目軟件產品解決方案成功案例網站地圖加入我們聯系我們
www精品一区二区三区四区