HTML~線・表を描こう~

線をひこう

HTML~文字表示編~で勉強された方は

「っつかさー文字ばっかじゃん」なーんて言われているかもしれません。。。

そろそろ違うこともしてみましょー
ズバリ線の描画です!!!

HTMLで線を描画するためには
<HR>タグを使用します。<HR>の属性について書いてみます。

  • width属性
 線の長さ(横の長さ)を指定できます。(半角数字と1%から100%)
 (※半角数字指定の場合、指定した長さになりますが%指定の場合、ブラウザの大きさに対して線の長さが自動的に変わります。)

  • size属性
 線の太さ(縦の長さ)を指定することができます。(半角数字のみ指定できます。)

  • align属性
 線の位置を指定することができます。(left、center、rightのどれかを指定できます。leftは左寄せ、centerは中央寄せ、rightは右寄せになります。)

  • noshade属性
 線を塗りつぶしにすることができます。この属性に、属性値はありません。


などを利用して実際に線を書いてみてください。

サンプル)

<hr>↑これは普通の線(何も指定なし)です。
<hr width="450">↑width属性を450にしています。
<hr width="50%">↑width属性を50%にしています。
<hr size="20">↑size属性を20にしています。
<hr align="left" width="50%">↑arign属性をleftにしています。
<hr noshade>↑noshade属性にしています。

どんな線があらわれるやら・・・


表を作ろう


線を書くのと同様にHTMLには表を書くタグが存在します。
それが<table>タグです。

<table>タグは<tr>(行)、<td>(セル)を利用して
表を作成することができます。


サンプル)

 <table border="1">
  <tr><td>地名</td><td>イメージ</td><td>備考</td></tr>
  <tr><td>東京</td><td>大都市</td><td>標準語が聞ける</td></tr>
  <tr><td>大阪</td><td>そこそこ都会</td><td>関西弁が・・・</td></tr>
  <tr><td>名古屋</td><td>シャチホコ</td><td>やまちゃんさいこー</td></tr>
 </table>

自分でもつくってみてねー
最終更新:2012年05月01日 16:48
添付ファイル