qq ブラウザが css3 をサポートしていない場合はどうすればよいですか?-フロントエンドQ&A-php.cn

Qq ブラウザは CSS3 ソリューションをサポートしていません: 1. 「-webkit-、-ms-」互換性プレフィックスを追加します。 2. 「@keyframes、border-radius、box などのブラウザエンジンプレフィックス属性を追加する必要があります」 -影、背面の可視性」など。

qq ブラウザが css3 をサポートしていない場合はどうすればよいですか?

#このチュートリアルの動作環境: Windows7 システム、QQ ブラウザ V10.7.0&&CSS3 バージョン、Dell G3 コンピューター。

関連する推奨事項: 「

css ビデオチュートリアル」

QQ ブラウザが css3 をサポートしていない場合はどうすればよいですか?

css3 属性 (キーフレームやアニメーションなど) には、webkit や ms という接頭辞を付ける必要があります。携帯電話のブラウザが異なる場合は、さらに接頭辞が追加される場合があります。これにより、すべてのブラウザに適応するという目的が達成されます。

qq ブラウザが css3 をサポートしていない問題を解決する方法は次のとおりです:

1. 次の互換性プレフィックス

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

ログイン後にコピー

2 を追加します。主に必要なのは、ブラウジングを追加することです。ベンダープレフィックスの属性には次が含まれます:

@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 をサポートしていない場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。