CSS を使って IE 6 で PNG の半透明を有効にする | ヨモツネット
概要 IE 6 で img 要素で埋め込んだ PNG ファイルの半透明を有効にする JS はいろいろありますが、CSS でこれを行うための方法です。 利点として、JS で実現した場合、一瞬グレーの部分が表示されてしまいますが、この方法ではそれがありません。 PNG が読み込まれた時点で半透明が有効になっています。 また、CSS のセレクタを用いて、どの img 要素に対して半透明を有効にするかなどを決めることができます。 さらに、onload 後にドキュメントに appendChild や innerHTML などで追加された PNG ファイルについても、半透明が有効になった状態で追加されます。 動作確認用の demo (IE 6 用) 説明 アルファチャンネルを有効にしたい個所に対して以下のようなCSSを適用します。この例では、#sample の中の img 要素となります。(セレクター
画像の下にテキストが回りこまないレイアウト | ヨモツネット
概要 画像の横にテキストがあるようなレイアウトですがテキストが画像の下に回りこまないという CSS の書き方です。float を使うと、画像の下部にテキストが流れ込みますが、この方法は、画像の下にはテキストは流れ込みません。 さらに、画像の大きさは自由に設定できて、スタイルの使い回しが可能なレイアウトです。(画像が配置されるスペースの横幅は画像のサイズにフィットします。) これにより、画像のサイズごとに class 属性を設定したりスタイルを作る必要がありません。 また、画像がない場合でも画像分が詰められて表示されます。 これを応用すれば柔軟に対応できるコンポーネントをつくることができます。 動作確認用の demo 動作確認用の demo (左右逆版) 説明 display プロパティに table や table-cell を設定して実現します。構造を table 要素に置き換えて考えて
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
