qq瀏覽器不支持css3的解決方法

這篇文章給大家分享的是有關qq瀏覽器不支持css3的解決方法的內容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。

qq瀏覽器不支持css3的解決辦法：1、添加“-webkit-、-ms-”兼容性前綴；2、需要添加瀏覽器引擎前綴屬性如“@keyframes、border-radius、box-shadow、backface-visibility”等。

qq瀏覽器不支持css3怎么辦？

css3屬性，比如keyframe和animation都需要加webkit、ms前綴，針對手機不同瀏覽器可能還要加更多前綴。以此達到適配所以瀏覽器的目的。

解決qq瀏覽器不支持css3的方法如下：

1、添加如下兼容性前綴

-webkit-  /* 使用Webkit引擎的瀏覽器 */ 
-ms-    /* Internet Explorer */

2、主要的需要添加瀏覽器引擎前綴(vendor-prefix)的屬性包括：

@keyframes
移動和變換屬性(transition-property, transition-duration, transition-timing-function, transition-delay)
動畫屬性 (animation-name, animation-duration, animation-timing-function, animation-delay)
border-radius
box-shadow
backface-visibility
column屬性
flex屬性
perspective屬性

3、例子：

/* 簡單屬性 */ 
.myClass { 
    -webkit-animation-name: fadeIn; 
    -ms-animation-name: fadeIn; 
    animation-name: fadeIn;  /* 不帶前綴的放到最后 */ 
} 
/* 復雜屬性 keyframes */ 
@-webkit-keyframes fadeIn { 
    0% { opacity: 0; } 100% { opacity: 0; } 
} 
@-ms-keyframes fadeIn { 
    0% { opacity: 0; } 100% { opacity: 0; } 
} 
/* 不帶前綴的放到最后 */ 
@keyframes fadeIn { 
    0% { opacity: 0; } 100% { opacity: 0; } 
}

感謝各位的閱讀！關于“qq瀏覽器不支持css3的解決方法”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！