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

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

推薦する

1 分で Nginx のバージョンをスムーズにアップグレードおよびロールバックする方法

今日は、企業の実際の本番環境でよく遭遇する、Nginx を新しいバージョンにアップグレードし、古いバ...

HTMLエンコードによる文字化け問題について

今日、3年生から質問がありました。彼が書いた HTML コードを開くと、文字化けした文字が表示されま...

Docker での RocketMQ の詳細なインストールと使用

RocketMQ イメージを検索するには、Docker の hub.docker.com で検索する...

mysql explain(分析インデックス)の使い方の詳しい説明

EXPLAIN は、MySQL がインデックスを使用して選択ステートメントを処理し、テーブルを結合す...

sqlとmysqlの違いは何ですか?

SQL とは何ですか? SQL はデータベースを操作するために使用される言語です。 SQL はすべ...

IDEA は Docker プラグインを使用します (初心者向けチュートリアル)

目次例示する1. Dockerリモートアクセスを有効にする2. Dockerに接続する3. イメージ...

CSS3のtext-fill-colorプロパティの詳細な説明

text-fill-color とは何を意味しますか?文字通りの意味から言えば、「テキストの塗りつぶ...

CSS で画像アダプティブ コンテナを実装するいくつかの方法 (要約)

多くの場合、画像をコンテナのサイズに合わせて調整する必要があります。 1. imgタグ方式幅と高さを...

jsのディープコピーを理解しましょう

目次js ディープコピーデータ保存方法浅いコピー/深いコピーとは何か一般的なディープコピーの実装1....

Linux で固定 IP を設定する方法 (テスト済みで効果的)

まず、仮想マシンを開きます xshell5 を開いて仮想マシンに接続します (より便利です。Linu...

ウェブページの色特性の分類

色特性の分類あらゆる色は、赤、緑、青の三原色から構成されます。三原色の中で暖色なのは赤だけなので、作...

DIV の一般的なタスク (パート 1) — 一般的なタスク (スクロール バーの表示、div の非表示、イベント バブリングの無効化など)

最も一般的に使用されるレイアウト要素として、DIV は Web 開発において重要な役割を果たします。...

MySQLはテーブルデータを復元するためにfrmファイルとibdファイルを使用します

目次frm ファイルと ibd ファイルの紹介frm ファイル回復テーブル構造ibd ファイル回復テ...

Vueのフロントエンドとバックエンドのポートの不一致の問題を解決する

Vue のフロントエンドとバックエンドのポートが一致していませんconfig index.jsファイ...

HTML タグの表示モード (ブロックレベル タグ、インライン タグ、インライン ブロック タグ) に関する簡単な説明

今日の講義では、HTML におけるタグの表示モードについてお話ししましたが、これはブロックレベルタグ...