muroiです。
今日はHTMLのブロックレベル要素について学習しました。
主な学習内容
- ＜pre＞要素
- ＜ul＞要素
- ＜ol＞要素
- ＜li＞要素
について学習しました。
・＜pre＞要素について。
これは改行やスペースをそのまま表示したい時に使用します。
例：
＜pre＞ こんな風にスペースはスペースとして扱われます。 ＜／pre＞
制限事項として、ブロックレベル要素を含める事ができません。またtab文字は用いないよう強く推奨されています。（tabは一文字として扱われてしまうためでもある。）
他にも横幅を指定するwidth属性は非推奨項目となります。
・＜ul＞要素について。
これは箇条書きのリストを作成する時に使用します。type属性を指定することにより、先頭につける記号の形を変える事ができます。
制限事項として、＜li＞要素以外を子要素に含む事ができません。
ちなみに、type属性を指定して形を変える事ができると書きましたが、このtype属性も非推奨項目となります。他にもより狭い範囲にリストを作るcompact属性もありますが、同じく非推奨項目です。
使用例：
＜ul＞
＜li＞項目１＜/li＞
＜li＞項目２＜/li＞
＜/ul＞
出力時：
- 項目１
- 項目２
このように表示されます。
・＜ol＞要素について。
これは番号付きのリストを作成する際に使用します。
制限事項や非推奨項目は＜ul＞要素と同じで、加えて開始の番号を指定するstart属性も非推奨項目です。
使用例：
＜ol＞
＜li＞項目１＜/li＞
＜li＞項目２＜/li＞
＜/ol＞
＜ol start=”100″＞
＜li＞項目１＜/li＞
＜li＞項目２＜/li＞
＜/ol＞
出力時：
- 項目１
- 項目２
- 項目１
- 項目２
このように番号つきのリストを作成する事ができ、start属性を指定してやれば、その番号からのリストも作ることができます。
・＜li＞要素について。
これは＜ul＞要素や＜ol＞要素のリスト項目を定義する際に利用します。
制限事項として、＜ul＞＜ol＞の要素内でしか使用できません。（現在のHTML仕様では）
value属性というものがあり、これは＜ol＞要素でいうstart属性と同じ挙動をし、指定された＜li＞要素以降の番号を変更し、適用させていきます。
また、＜li＞要素の中に＜ul＞や＜ol＞要素も含む事は可能です。
含んだ例：
＜ol＞
＜li＞項目１＜/li＞
＜li＞項目２＜/li＞
＜li＞＜ul＞＜li＞項目３＜/li＞＜/ul＞＜/li＞
＜li＞項目４＜/li＞
＜/ol＞
出力時：
- 項目１
- 項目２
-
- 項目３
- 項目４
このように＜li＞要素内に＜ul＞要素を含んで記述する事ができます。
いくつでも含む事はできるみたいですが、あまり含みすぎるとわかりにくくなってしまいますね・・・。
あと今日は天気がすごく良かったのでなんとかこのまま晴れの日が続いてくれるといいのですが・・。
雨の電車はきついです。
—-
(2008/04/21 18:28 hirafuji追記)
お待たせしました〜動画をご覧下さい！
コメントをどうぞ