IE8対応のボーダー半径処理方法
|
canisue (http://caniuse.com/#search=border-radius) によると、border-radius の互換性は次の図に示されています。
テストコード:
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge,chrome=1">
<タイトル></タイトル>
<スタイル タイプ="text/css">
* {
マージン: 0;
パディング: 0;
}
#ヘッダー{
幅: 400ピクセル;
高さ: 400px;
マージン: 10px;
境界線の半径: 10px;
境界線: 1px 実線の赤;
}
</スタイル>
</head>
<本文>
<div id="ヘッダー">
</div>
</本文>
</html>IE8ブラウザの影響:
border-radius は IE8 ブラウザと互換性があります:
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge,chrome=1">
<タイトル></タイトル>
<スタイル タイプ="text/css">
* {
マージン: 0;
パディング: 0;
}
#ヘッダー{
幅: 400ピクセル;
高さ: 400px;
マージン: 10px;
境界線の半径: 10px;
境界線: 1px 実線の赤;
/*キー属性の設定にはパスの設定が必要です*/
動作: url(PIE.htc);
}
</スタイル>
</head>
<本文>
<div id="ヘッダー">
</div>
</本文>
</html>IE8ブラウザでの効果:
PIE.HTC ダウンロード アドレス: http://css3pie.com/ PIE は次のような CSS3 プロパティを処理できます。
IE8: 互換性は主に次のとおりです。 (1) CSS3属性はサポートされていません。CSS3効果を実装するにはPIE.jsが使用されます。 （２）メディアクエリ 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 |
<<: コンテンツタイプの説明、つまりHTTPリクエストヘッダーのタイプ
推薦する
Nginx は高可用性クラスタ構築を実装します (Keepalived+Haproxy+Nginx)
1. コンポーネントと実装機能Keepalived: Haproxy サービスの高可用性を実現し、...
フロントエンドパフォーマンス最適化に関する補足記事
序文私は、Web サイトのフロントエンド パフォーマンス最適化のための JavaScript と C...
Vue プロジェクトでブラウザ キャッシュ設定を無効にする例
プロジェクトをリリースするときに、キャッシュをクリーンアップする必要があるという問題に遭遇することが...
MySQL 8.0.15 バージョンのインストールチュートリアル Navicat.list への接続
落とし穴1. ネット上の多くのチュートリアルでは環境変数を設定するファイル名はmy.iniと書いてあ...
Linux netstatコマンドの詳細な説明
目次Linux netstat コマンド1. TCP接続ステータスの詳細な説明2. コマンド形式3....
MYSQL 文字関数を使用してデータをフィルタリングすることに関する質問
問題の説明:構造：テストには2つのフィールドがあります。これらは col1 と col2 で、どちら...
vuex ベースのショッピングカート機能の実装
この記事の例では、ショッピングカート機能を実装するためのvuexの具体的なコードを参考までに共有して...
Linux trコマンドの使用
1. はじめにtr はテキストの一部を変換または削除するために使用されます。 tr は transl...
ウェブデザイナーは適した人材
<br />この世に道はない。より多くの人が歩くようになると、それは道になります。最初は...
CSS 共通スタイルで二重矢印を描画するサンプルコード
1. 単一の矢印への複数の呼び出し単一の矢印を実装したら、二重矢印を実装するのは簡単です。上では、単...
CSSページ下部固定を実現する8つの方法の詳細な説明
ページを書いているときに、ページの内容が小さくてフッターがページの真ん中に留まってしまうといった状況...
ウェブページのフラッシュアニメーションが表示されない問題の解決策
<br />解決手順は次のとおりです。スタート -> 実行 -> reged...
Vueプラグインの実装で発生した問題の概要
目次シーン紹介プラグインの実装問題1: 重複したヘッダーコンポーネント質問2: 別の実装アイデア質問...
VMware仮想マシンでのLinuxのコピー＆ペーストの詳細な説明
1. VMware Workstation 上の Linux: 1. ソースの更新（オプション） v...
モバイルデバイス上のぼやけた小さなアイコンの問題を解決する方法
序文以前、画像とテキストの垂直方向のずれの問題について説明しました。ここで示した小さな例では、小さな...