ホームページ 作り方
だれでもわかるホームページ講座
ホームページの作り方 教えます。
http://www.homepage-guide.com
　トップページ >>ボックスとは

CSSのボックスとは
ボックスの概念を理解する事が、スタイルシートを上手に使う秘訣です。　
スタイルシートでは全ての要素はボックスというもので表される領域を持っていると考えます。

　ボックスを構成する各項目についてはこの後の各プロパティの解説にゆずりますが、HTMLでは特定の要素の属性でしかなかった背景色、余白や枠線をスタイルシートではどの要素にもつけることができるということを覚えておいてください。
　この自由度の高さがホームページのデザインにスタイルシートが使われる理由です。
下にいくつかサンプルをのせておきます。HTMLだけでは不可能なデザインがスタイルシートを使うことで実現していることがわかると思います。

<H2 style="color:white; background-color:black;">見出しを白抜きする例</H2>

見出しを白抜きする例

ロゴっぽい文字列 
<H1 style="font:bold 40px/0.5em 'Times New Roman';color:#FF66CC;">CSS<BR>
<SPAN style="color:#CC66CC;padding-left:0.5em;">HTML</SPAN><BR>
<SPAN style="color:#CC66FF;padding-left:1em;">Homepage</SPAN></H1>

CSS
HTML
Homepage

リストのマーカーを画像にする 
<UL style="list-style-image:url(img/onept.gif);">
  <LI>HTML ･･･HyperText Markup Languageの略語です。
  <LI>WWW ･･･World Wide Webの略語です。
  <LI>HTTP ･･･HyperText Transfer Protocolの略語です。
  <LI>FTP ･･･File Transfer Protocolの略語です。
</UL>
  • HTML ･･･HyperText Markup Languageの略語です。
  • WWW ･･･World Wide Webの略語です。
  • HTTP ･･･HyperText Transfer Protocolの略語です。
  • FTP ･･･File Transfer Protocolの略語です。

入門編

HTML編

CSS編
CopyRight(C) 2009- 「ホームページの作り方 教えます。」 All right reserved.