CSS

確認の意味でメモ。

[CSS] 実践 Web Standards Design

各種サンプルファイルのダウンロードなど。サポートページ。

見た事がないので表にまとめました。

プロパティの値としては、無い機能。しかし、display:inline;にすると実現する。
ブラウザによって点線の外観が微妙に変わるのが欠点。

text-indent:-9999;やdisplay:none;で実現できないデザインをCSSだけでロールオーバーを実現。
あと、javascriptが禁止の時などに使える方法。

  • 動作確認済みブラウザ
    [mac]Safari3,Firefox3,Opera9
    [Win]IE6,IE8,Firefox3,Safari3

使った素材

z-indexでロールオーバーサンプル

ポイントはボタンの両端の線をかぶらせている点。

あわせて読みたいブログパーツ