スタイルシート裏の裏


第5章 IE5.5とNetscape6のCSS


5-6.画像(IMG要素)

ボーダーの注意

NN4.0では、IMG要素へのボーダー(枠線)のスタイル定義ができませんでした。Netscape6ではどうでしょうか。

img  {
	border-color   	: pink;
	border-style  	: ridge;
	border-width	: 6px;
}
<img src="./css_image/ie.gif" alt="CSS効果あり">
<img src="./css_image/nn.gif" border=3 alt="スタイルシート使えません!">

NC4.7はまだ実装していなかったんですねえ。。Netscape6では、ちゃんと表示できるようになったようです。色使いは、これまで説明したのと同様、IEでは指定色よりも濃い色が、Netscape6では薄いが使われています。


チェックページ

ie501 nc4.7 netscape 6

パディングとマージン

せっかくだから、パディングとマージンも定義してみました。

img  {
  background-color : #d3d3d3 ;
  border-color: cyan;
  border-style: ridge; 
  border-width: 6px;
  margin:  1em;   
  padding: 1em;   
}

IE5.01ではパディングを適用していないんですね。パディング・マージンについては、Netscape6の方で忠実に適用しているように見えます。
チェックページ

ie5.01 ie5.5 nc4.7 netscape6

画像の位置関係って見栄えでは一番重要な部分なんですが、まだまだマージンやパディングを使って定義するのは難しいようです。かといって、LAYER要素を使うのは好きじゃないし、古いブラウザでは対応してくれないし。Word2000はすぐにLAYERを使っちゃうので困ってたりします(笑)。

n6_Indexに戻る ==== 前のページに戻る ==== 次のページへ