Que dois-je faire si le navigateur QQ ne prend pas en charge CSS3 ?

Le navigateur QQ ne prend pas en charge la solution CSS3 : 1. Ajoutez le préfixe de compatibilité "-webkit-, -ms-" ; 2. Vous devez ajouter des attributs de préfixe du moteur de navigateur tels que "@keyframes, border-radius, box -ombre, visibilité de la face arrière", etc.

L'environnement d'exploitation de ce tutoriel : système windows7, navigateur qq version V10.7.0&&CSS3, ordinateur Dell G3.

Recommandations associées : "Tutoriel vidéo CSS"

Que dois-je faire si le navigateur QQ ne prend pas en charge CSS3 ?

Les attributs CSS3, tels que l'image clé et l'animation, doivent être préfixés par webkit et ms. Pour différents navigateurs sur téléphones mobiles, d'autres préfixes peuvent être ajoutés. Cela atteint l’objectif de s’adapter à tous les navigateurs.

La méthode pour résoudre le problème selon lequel le navigateur QQ ne prend pas en charge CSS3 est la suivante :

1 Ajoutez le préfixe de compatibilité suivant

-webkit-  /* 使用Webkit引擎的浏览器 */ 
-ms-    /* Internet Explorer */

2. . La principale chose que vous devez ajouter est la navigation. Les attributs du préfixe du fournisseur incluent :

@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属性

Exemple :

/* 简单属性 */ 
.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; } 
}

.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!