Dynamic HTMLNo.04


Internet Explorer4.0 or Netscape Communicator4.0以上をご利用下さい。
それ以外のブラウザをご使用の場合は，CSSの効果は保証できません。

　７月号では，書体の設定について示しました。ご自分のブラウザでCSS を使用した場合，どの様な動きをするか理解できましたか？
　所詮使わなければ，普及するはずもないと考えていた｢CSS｣ いやぁ，実に嬉しいニュースがあります。なんと米マイクロソフト社は，オフィスの次期バージョンとして開発中のoffice2000のドキュメント形式にCSSやXMLを採用するとアナウンスしています。もちろん，CSSやXMLだけでは細かな表現ができないので独自の仕様も合わせ持つことになると思いますが...
　つまり，インタネットブラウザだけで，ほとんどのドキュメントが読めてしまうと言うことです。

【今月のネスケ度チェック】

Phase1
これは太字です。
これは太字です。
上記は，同じに見えますか？
No.3（７月号）では，｢Netscape Communicatorでは，font-weight の効果は得られません｣と書きましたが誤りです。<m(__)m>

Phase2
Hello World!!
オーバーラインが見えますか？
オーバーラインが見えない貴方は，Netscape Communicator を使用していますね。

Phase3
Hello World!!
Blink してますか？
Blink して見える貴方は，やっぱりNetscape Communicator を使用していますね。（笑）

　このコーナーでは，こうしたブラウザの差異をできるだけ多く暴露して行くと共に少しでも多くの方にCSS を理解してもらえればと考えます。

　第４回目は，枠と枠色の付け方について示します。
　何時もながら難しい説明は一切抜き。すべて，ご自分で学習してみて下さい。

枠と色を指定する。

border-width:xxpt サイズを指定します。
border-style:type タイプを指定します。
border-color:color 色を指定します。
指定の順序は，関係ありません。しかし，「；」で区切り続けて書くことが条件です。

Source Result Color
<DIV STYLE="border-style:none">none</DIV>
none
 None
<DIV STYLE="border-width:12pt;border-style:solid;border-color:gold">solid</DIV>
solid
 gold
<DIV STYLE="border-width:12pt;border-style:double;border-color:plum">double</DIV>
double
 plum
<DIV STYLE="border-width:12pt;border-style:inset;border-color:lime">inset</DIV>
inset
 lime
<DIV STYLE="border-width:12pt;border-style:outset;border-color:peru">outset</DIV>
outset
 peru
<DIV STYLE="border-width:12pt;border-style:groove;border-color:teal">groove</DIV>
groove
 teal
<DIV STYLE="border-width:12pt;border-style:ridge;border-color:deeppink">ridge</DIV>
ridge
 deeppink

枠サイズを変える。

<DIV STYLE="border-width:1;border-style:solid;border-color:turquoise">Size:1</DIV>

<DIV STYLE="border-width:4;border-style:solid;border-color:turquoise">Size:4</DIV>

<DIV STYLE="border-width:8;border-style:solid;border-color:turquoise">Size:8</DIV>

　JEFFさんの送別ウルトラクイズにかまけて，すんげぇ雑な内容になってしまいました。えっ！「毎度のことだって」こりゃまた失礼いたしました。
　来月号につづく。

このコーナーに関するご意見ご要望をお待ちしております。


９月号目次へ

９月号目次へ（フレーム未対応）