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 列挙型

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

推薦する

Nginx で同じドメイン名を持つ複数のプロジェクトを構成する方法

Nginx を使用して同じドメイン名で複数のプロジェクトを構成するには、次の 2 つの方法があります...

Linux で Apache を使用してファイル サーバーを構築する手順

1. ファイルサーバーについてプロジェクトでは、公開ソフトウェアやデータをプロジェクト チーム メン...

イメージのアップロードとダウンロードに docker をプロキシするためのプライベート ライブラリとして nexus を使用する

1. Nexusの設定1. Dockerプロキシを作成する外部ネットワーク ウェアハウスからローカル...

MySQLの累積集計原理と使用例の分析

この記事では、例を使用して、MySQL 累積集計の原理と使用方法を説明します。ご参考までに、詳細は以...

CSS3 を使用して入力複数選択ボックスのスタイルをカスタマイズする例

原則: まず入力要素を非表示にし、次に CSS を使用してラベル要素のスタイルを設定します (他の要...

JavaScriptにおけるこのポインティング問題の詳細な説明

序文信じてください。この記事の 7️⃣ ステップを覚えておけば、JS の this リファレンスを完...

エラー 1862 (HY000): パスワードの有効期限が切れています。ログインするには、..... を使用してパスワードを変更する必要があります。

エラーメッセージ:エラー 1862 (HY000): パスワードの有効期限が切れています。ログインす...

フロントエンドJavaScriptの動作原理

目次1. JavaScript エンジンとは何ですか? 2. V8エンジン3. ランタイム環境4. ...

シンプルなドラッグ効果を実現するjs

この記事では、簡単なドラッグ効果を実現するためのjsの具体的なコードを参考までに共有します。具体的な...

MySQL トリガーの原理と使用例の分析

この記事では、例を使用して、MySQL トリガーの原理と使用方法を説明します。ご参考までに、詳細は以...

HTMLは正規表現を使用してテーブルの例をテストします

以下は、HTML で正規表現を使用してテーブルをチェックするサンプル コードです。具体的なコードの内...

MySQLでNULL値を判定する際の落とし穴事例

目次序文Mysql の case when 構文:事例実践:要約:序文今日、プログラムを開発している...

MySQL で不明なフィールド名を回避する方法

序文この記事では、DDCTF の 5 番目の質問、つまり不明なフィールド名をバイパスする手法を紹介し...

Dockerコンテナ接続実装手順の分析

一般的に言えば、コンテナが起動した後、ポート マッピングを通じてコン​​テナが提供するサービスを使用...

.Net Core を使用して数千万のデータを MySQL にインポートする手順

目次事前準備実施方法: 1. 単一のデータを挿入する2. マージデータ挿入3. MySqlBulkL...