CSS3 IE対策まとめ
CSS3を使うにあたっていつも問題になるのが Internet Explorer（IE）です。CSS3への対応が遅い上に、旧バージョンを使い続けているユーザーも結構いますので、CSS3を使うことに躊躇する人も多いのではないでしょうか？ ということでCSS3を使うにあたって知っておきたいIE対策を紹介します。 1. CSS3の対応状況を確認する まず、IEのバージョンごとでCSS3にどこまで対応しているか知っておく必要があります。個人的によく使っているのはこのサイトです。 CSS3 & HTML5 Browser Support CSS3で追加されたプロパティ、セレクタについてブラウザごとの対応状況が分かりやすく表示されています。 2. CSS3セレクタに対応する セレクタはSelectivizr.jsだけあれば簡単に対応できます。「CSSセレクタって何？」「CSS3セレクタってどういうもの
CSS：初心者の頃にハマったスタイルシートのあれこれ … IE7多め
CSS、スタイルシート。初心者のころには CSS のスタイルがうまくいかなくて、半日や丸一日悩んだこともいっぱいありました。最近では、やっとひと通り覚えて、思うようにできるようになったかなーという感じです。今回は初心者だったころ、ちょっと悩んだことなどをいくつかまとめてみました。 Webサイトの見た目をデザインしていくのに欠かせない CSS。度々これってどうやるんだろうとか、どうしてこうなっちゃうの？というものに遭遇します。また、今までは IE6 をターゲットに含めてましたけど、そろそろ IE7 からをターゲットにすればいいのかなーと思うこともあって、過去のスタイルシートの書き方の習慣を変えようかなとも思っています。 スタイルシートを書いていて、今まで遭遇した不具合やその回避方法、また今まではこうしてたけど、これからは変わるかもしれないなーといものをまとめてみました。もうそんなことしてない
IE6で透過pngを使用可能にする「alphafilter.js」が、ロールオーバーに対応して嬉しい | Katt Weblog
IE6で透過pngを有効にする「alphafilter.js」がロールオーバーにも対応して、凄く便利になっていたので嬉しくて投稿。 配布元及び詳しい使用方法は、かの有名なto-R様。 みなさん凄い人ばかりで尻込みしてしまいます・・・。 使い方は本当に簡単。まずはダウンロードした「alphafilter.js」を、例のごとくhead要素内で読み込み。この時、読み込みを高速化させるためdefer属性の記述をする点がポイントみたいです。 あとは透過にしたい画像にclass=”alphafilter”を付加するだけで、IE6でも透過pngの使用が可能になります。 透過機能と併せてロールオーバー機能を使用する場合は、デフォルトの画像が「sample.png」ならロールオーバー後の画像は「sample_on.png」のように拡張子の前に「_on」を付加した画像を作ってデフォルト画像と同階層にアップ。
IE6のmin-width、min-heightハックに関して - Webtech Walker
CSSでmin-heightをクロスブラウザにする最も簡単な方法『Easiest cross-browser CSS min-height』 という記事を見かけたんですが、min-widthってこれじゃダメな気がするんです・・・ IE6では min-height や min-width が効かないため、それを効かせるためにはいろいろなハックやブラウザごとのスタイルシートが必要だった。 しかし以下のようにすればIE6にも対応したものが実現できる。 min-widthのソースは以下のとおり .bar { min-width: 100px; width: auto !important; width: 100px; } min-widthはIE6で実装されていないので、無視されます。そして、同一ブロック内では!importantが無視されるというIE6のバグを利用して「width:100px」を
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
わずか四文字でIE6/7/8を区別するCSSハック | コリス
