IEだけに適用されるHTML「条件付きコメント」の使い方
こんにちは、さち です。 ウェブサイト制作の経験がある人には有名な話なんですが 古いバージョンの Internet Explorer（以下：IE） は ウェブサイトの表示で 特殊な挙動，未実装の問題 があり サイトを作る時に、別途 IE 対策が必要です。 そこで今回は IE だけに適用される HTML を記述できる 「条件付きコメント」の使い方についてまとめていきます。 「条件付きコメント」とは？ 「条件付きコメント」は IE だけが解釈できる HTML コードです。 構造は下記のようになっています。 <!--[if IE 7]> 適用するHTMLコード <![endif]--> 最初に、<!--[if IE 7]> で適用する IE のバージョンを指定。 例では、[if IE 7] なので 閲覧者のブラウザが IE7 の場合に適用します。 次に、適用内容を HTML 形式で記述。 最後に
ネガティブマージンを使うなら position: relative; を併記 – かめめねっと
レイアウト上、margin:-20px; などと表記したいときもあるんだけど、IE6は言うことを聞いてくれない。。。 ネガティブマージンとは「マイナス値のマージン」のことですが、IE6ではこのマイナス値を読み取ってくれないためにこのようなことが起こる。 そのため、margin:-20px; とするなら、 .要素{ margin-left:-20px; position:relative; } とするか、marginはdiv上でfloatプロパティを使うと値が2倍になってしまうバグもIE6にはあるので、 .要素{ position:relative; left:-20px; } とするのが良いかも知れない。 ただ、親要素の位置などによっては、計算が異なる場合があるので、必ずしも同じ位置になるとは限らないと思うので、その場に応じて使いやすい方を使おう。 私は position 好きなので、後者
IE8以下でもCSS3 Media Queriesが使える「respond.js」を試す - ウェブ学のすすめ
IE8以下でもCSS3 Media Queriesが使えるようになるスクリプトとして主に「css3-mediaqueries-js」と「Respond.js」があります。今回はRespond.jsが動作するか試してみました。 Respond.js導入のポイント cssファイルはエンベッドしない。 cssファイルはHTMLファイルと同一のサーバーに置く ローカルでは動作しない サーバーにアップするか、ローカルのサーバー環境(XAMPPなど)から確認する プレビュー ↓サーバーにアップするとIE8以下でもMedia Queriesが動作されます。 http://webgaku.hotcom-web.com/respond_test.html ↓Adobe BrowserLabでチェック（IE6の場合） ※jsdo.itから出力されたHTMLではIE8以下にMedia Queriesが適用されま
たった一行を追加するだけでIE6/7/8をCSS3対応にする -CSS3 PIE
IE6/7/8でもCSS3の角丸、ボックスシャドウ、グラデーション、マルチバックグランドなどを使えるようにするbehaviorスクリプトを紹介します。
レスポンシブWebデザインをIE8に対応させる方法 - ECサイト構築運営に役立つ情報発信｜モバイルファーストマーケティングラボ
InternetExplorerは昔かサイト制作者を悩ませ続けてきました。せっかくレスポンシブサイトを作ろうとしても、レスポンシブサイトというとセットでついてくるメディアクエリ、これにはIE8以下の下位バージョンが対応しておらず、表示は見事に崩れます。 未だ切り捨てられないIEへの対応 モバイルファーストかつレスポンシブということを思えばIE、しかも下位バージョンなら切り捨ててもいいのではないかと思いますが、様々な事情から切り捨てられないシーンもあるでしょう。以前に比べれば低くなったとは言え、特に日本ではIE8のブラウザシェアはまだまだ残っています。 そういった時のために、比較的手軽にIE向けの対応を行える方法があります。 1.「css3-mediaqueries.js」を読み込む こちらはGoogleが推奨している比較的有名なスクリプトです。html5.jsやIE9.jsなどと併用しても
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
サービス終了のお知らせ
http://web.donnatokimo.com/css/392
