IE6、IE7、IE8 で CSS3 の丸い角と影のスタイルをサポートする

IE6、IE7、IE8 で CSS3 の丸い角と影のスタイルをサポートする
CSS3 の角丸や影の効果を使ったページを作りたいのですが、IE ブラウザでは対応していません。これを実現できるプラグインがあると聞きました。土曜日にインターネットで方法を見つけました。原文は以下のとおりです。
すべてのフロントエンド エンジニアは、IE6、IE7、IE8 が CSS3 プロパティをサポートしていないか、完全にサポートしていないことを知っています。
CSS3 には、丸い角、影、グラデーションの透明度、グラデーションの背景など、強力で美しい効果が数多くあります。
IE6 の時代には標準が存在せず、さまざまな理由から、IE6 ユーザーは IE のバージョンをほとんど更新しませんでした。
IE6、IE7、IE8 で CSS3 効果をサポートする 1 つの方法は、VML シミュレーションを使用することです。
VML は Vector Markup Language の略で、もともと Microsoft 自身によって開発された非常に強力な言語です。
つまり、VML を使用すると、IE で丸い角を作成できます。半透明、影、グラデーション背景。
昨年すでに、フロントエンドプログラマーによる開発を容易にするために、何人かの外国人がこのアイデアをプラグインに書き込んでいました。 。 。
IE6、IE7、IE8 で CSS3 特殊効果をサポートできるようになります...
以前からバグが深刻化していましたが、本日確認したところ公式がこのバグを修正し、js レンダリング方法を追加しました(以前はビヘイビアを使用してインポートされていました)。
 
通話方法はこちら:
1. Web ページに PIE.js スクリプトを読み込みます。
IE 以外のブラウザでのダウンロードを防ぐために、IE 固有のコメントが使用されていることに注意してください。
コードをコピー
コードは次のとおりです。
<!--[IE 10の場合]> <script type="text/javascript" src="PIE.js"></script> <![endif]--> 2. jsで呼び出します: $(関数() { if (window.PIE) { $('.rounded').each(function() { PIE.attach(これを); }); } });
3. 完了です。 IE6 で CSS3 をサポートできるようにするすべてのプラグインの中で、これはおそらく最高のものです。 公式リアルタイムテストの例: http://css3pie.com/ 公式ダウンロード: http://css3pie.com/download-latest 長い間テストしましたが、うまくいきませんでした。あまりにも不注意で、2 つの点を見落としていました。まず、ローカル プレビューが無効だったため、サーバー環境またはローカル サーバー環境に転送する必要がありました。次に、CSS に behavior: url(pie.htc); を追加するのを忘れていました。今日ようやくテストしてみましたが、新たな問題が発生しました。アダプティブ幅を使用していたのですが、追加したら水平スクロールバーが出てきました。削除したところ、他の状況では正常でした。また、テキストの影にも影響がないようです。このような問題に遭遇したことがあるでしょうか。使用したい場合は試してみてください。

<<:  TypeScript 列挙型

>>:  ユーザーがフォームを繰り返し送信するのを防ぐ方法の概要

推薦する

Mysql の一般的なベンチマーク コマンドの概要

mysqlslap共通パラメータの説明–auto-generate-sql システムはテスト用のSQ...

Dockerでnginxをデプロイし、設定ファイルを変更する方法

Dockerでnginxをデプロイするのはとても簡単ですたった 1 行のコマンド: docker 実...

Vueリクエストインターセプターの設定方法の詳しい説明

以下の手順に従ってください1. request.jsコンテンツ: http リクエスト インターセプ...

CSSにおけるマージン値と垂直マージンの重なりについて

平行ボックスの余白 (二重余白の重なり) に関する面接の質問: 1 つのボックスに上余白があり、もう...

Server-U 14バージョンのインストールと使用方法

Server-Uソフトウェアの紹介Server-U は非常に強力なファイル マネージャーです。FTP...

地域のカスタムカラーのためのechars 3Dマップソリューション

目次質問伸ばす問題を解決する要約する質問プロジェクトの要件に従って、以下の州地図で個々の都市を(異な...

Linux で仮想コンソール セッションをロックする方法

共有システムで作業しているときは、他のユーザーが自分のコンソールを覗き込んで、自分が何をしているか見...

Vue+Element UI でサマリーポップアップウィンドウを実装するプロセス全体

シナリオ: 検査文書には n 個の検査詳細があり、検査詳細には n 個の検査項目があります。実装効果...

MySQL 8.0 redo ログの詳細な分析

目次序文REDOログの生成REDOログ送信REDOログの保存と通知ユーザースレッドに通知要約する序文...

私の CSS フレームワーク - base.css (ブラウザのデフォルト スタイルをリセット)

コードをコピーコードは次のとおりです。 @文字セット "utf-8"; /* @...

Nginx + consul + upsync を使用して動的負荷分散を実現する方法の詳細な説明

目次前提条件DNSドメイン名解決プロセス外部ネットワークマッピングnginxコア知識nginxとはア...

ポータルサイトのフォーカス画像のデザインに関するいくつかの結論

フォーカス画像は、画像、テキスト、動的なインタラクティブ効果を統合したコンテンツを表示する方法です。...

三角形を描画するための CSS 実装コード (border メソッド)

1. 単純な三角形を実装するCSS ボックス モデルの境界線を使用すると、次のような三角形を実現で...

three.js を使用してクールなアシッドスタイルの 3D ページ効果を実現します

この記事では、主にReact + three.jsテクノロジースタックを使用して3Dモデルの読み込み...

CSS の優先順位に関する詳細な紹介

CSS の優先順位について話す前に、CSS とは何か、CSS が何に使用されるのかを理解する必要があ...