pngを使う

ここでは、png(ピング)を使った表示方法を解説します。
JavaScriptを使ったCSSの切り替えのテクニックは結構有名ですので、おぼえておいても損はしないと思います。
ここでは「A List Apart」というサイト(英語)でフリーで配布されている「styleswitcher.js」というスクリプトを使用します。
一番下の近くに”Download styleswitcher.js”という項目があるので、それをクリックしてダウンロードしてください。

続きを読む pngを使う

CSS+JSで作るドロップダウンメニュー

CSS+JSで作るドロップダウンメニュー

今回はCSSとJavascriptを使って、ドロップダウンメニューを作ります。
CSSのみで作成することも可能ですが、どうもMacIE5.2で動かないのです。。。確かに仕事をしていて、今の対象ブラウザにMacIE5.2が入っているのはどうかと思うところもありますが、まだ使用している人もいるのは事実。。。
私自身、本や他のサイトを参考にさせてもらってますが、なかなか色々なブラウザに対応したものがなくて苦労しました。次に探すのも面倒なので、ここに解説を載せておきます。

続きを読む CSS+JSで作るドロップダウンメニュー

CSSハック一覧

ここでは、CSSハックを紹介します。Netscape Navigator4.0といった古いブラウザでは、CSSのサポートが不十分なために、モダンブラウザと同じレイアウトができないことがあります。またレイアウトがくずれてしまう時もあります。そこでCSSハックを用いて一部のブラウザに対してCSSを読み込ませないようにする方法が一般的となっています。

続きを読む CSSハック一覧

floatで作る3段組(固定)

ここではfloatで作る3段組(固定)を解説します。
よくブログなどでみることが多いレイアウトです。2段組の仕組みを理解したら、すぐに理解できるものです。
ここでは、2段組で作ったベースを利用して、3段組みを作ってみます。

続きを読む floatで作る3段組(固定)

floatで作る2段組(センター揃え)

ここではfloatで作る2段組(センター揃え)を解説します。
センター揃えとは表示領域がウィンドウの中央に位置しているものです。今でこそ左端を基準にしたサイトというものは増えてきていますが、仕事をしているとセンター揃えのサイトを作ることは結構あります。

続きを読む floatで作る2段組(センター揃え)