兼容性總結

火狐31.0以下兼容注意事項

1.css不兼容

background-position: 0 -30px;//兼容
background-position-y: -30px;//不兼容

1.2 關於使用PIE.htc 進行IE兼容CSS3

圓角CSS3等IE9+會兼容，IE8以下不兼容CSS3，使用PIE，PIE兼容所有IE瀏覽器

一、首先需要下載一個文件PIE.htc

鏈接 

提取碼：32in

二、使用例子

1、引入文件。

注意：

            最好是直接使用 URL 的絕對路徑；

            注意css文件相對html位置或者絕對路徑，非css位置；

            一般直接使用*引入在IE8以下讓每個元素具有；

2、在css元素中加上  behavior:url(pie.htc);

3、可以愉快的寫css hack啦 ，這時需要的圓角平移等等各種css3屬性在ie8上都可以展示出來

.box{
	  width:250px;
	  height:250px;
	  background-color:#34538b;
	  -moz-border-radius:10px;      
	  -webkit-border-radius:10px;
      /* behavior: url(plugins/lib/PIE-1.0.0/PIE.htc); */
	  /* 或者絕對路徑 */
	  behavior: url(file:///D://plugins/lib/PIE-1.0.0/PIE.htc?v=1576805621479);
      border-radius:10px;//圓角
      border-image: url(../../../images/star.png) 30 30 round;//邊框背景(IE不生效)
     -pie-background: rgba(187, 158, 240, 0.3);//rgba
     -pie-background: linear-gradient(148deg, #00e8bb 0, #eab7cf 43%, #9aece2 100%);//漸變
}

1.3不引入PIE得一種方式解決兼容

  線性漸變（linear-gradient）

IE系列 
filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF0000',endColorStr='#F9F900',gradientType='0'); 
參數：startColorStr起始顏色 endColorStr結束顏色 gradientType爲0時代表垂直，爲1時代表水平 

Firefox 
background: -moz-linear-gradient(top, #FF0000, #F9F900); 
參數：top、bottom垂直，left、right水平 例如：top時從頂部由#FF0000到#F9F900漸變，bottom時從底部由#FF0000到#F9F900漸變 

Opera 
background: -o-linear-gradient(top,#FF0000, #F9F900); 
參數：top、bottom垂直，left、right水平 例如：top時從頂部由#FF0000到#F9F900漸變，bottom時從底部由#FF0000到#F9F900漸變 

webkit，如Chrome、Safari等 
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FF0000), to(#F9F900)); 
參數：linear線性， x1 x2, x3 x4 x1與x3相同時垂直，x2與x4相同時水平 from起始顏色 to結束顏色

1.4 rgba，兼容所有瀏覽器IE專屬濾鏡 filter:Alpha(opacity=x)

.demo{
  padding: 25px;
  background: #000000;
  filter:Alpha(opacity=50);/* 只支持IE6、7、8、9 */
  position:static; /* IE6、7、8只能設置position:static(默認屬性) ，否則會導致子元素繼承Alpha值 */
  *zoom:1; /* 激活IE6、7的haslayout屬性，讓它讀懂Alpha */
}
.demo p{
    color: #FFFFFF;
    position: relative;/* 設置子元素爲相對定位，可讓子元素不繼承Alpha值，保證字體顏色不透明 */
}

2.js

檢查jquery版本

假如項目中有用到jquery,則首先檢查jquery版本是否在2.0以上.2.0以上版本的jquery不支持ie8.