上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
とてもシンプルな作表の方法をご紹介します。
まずは例を挙げてみますよ。
<table border="1"cellspacing="0"bordercolor="#666666">
<tr><td>1マスできました。</td></tr>
</table>
↓↓↓こうなります。
1マスできました。

シンプルな囲いですので表というよりも、記事の一部を強調したり
するのに使えそうです。
表っぽくするなら横にもう1マスつなげて…
<table border="1"cellspacing="0"bordercolor="#666666">
<tr><td>1行目A</td><td>1行目B</td></tr>
</table>
↓↓↓こうなります。
1行目A1行目B


赤文字部分がテーブルタグ。作表のタグです。
基本は<table>○○</table>ですが、
cellspacing="0" によって枠幅をなくし、
bordercolor="#666666" によって色をつけてみました。
色のコードはFC2であれば記事を書く際のアイコンから参照できます。
cellspacing="0"を省いた場合は外枠に幅ができます。
↓↓
1行目A1行目B

ちなみに border="1" の数字を変えてみると・・・
border="5"
1行目A1行目B
border="9"
1行目A1行目B

いろいろ遊べそうです(^^)


そして


緑の部分が横一行を表す部分です。
<td>○○</td> でセルを定義します。
<tr>△△</tr> で横一行を定義します。
つまり、<tr>△△</tr>の△△部分にセルを表す<td>○○</td>を連ね
ていけばいいわけです。
最初に挙げた例では一行にセルが2個入っています。
この行を積み重ねてゆくと
<table border="1"cellspacing="0"bordercolor="#666666">
<tr><td>1行目A</td><td>1行目B</td></tr>
<tr><td>2行目A</td><td>2行目B</td></tr>

</table>
1行目A1行目B
2行目A2行目B


これで応用ができますね。

このやり方の便利な点は表の幅を指定しないために、長い文章や画像等
を入れても表が勝手に伸び縮みしてくれるというところです。
1行目A 枠が自動的に伸びてくれます。
2行目A 2行目B

いちいち調節しなくて済むのでラクですよ!



ランキング応援して下さると嬉しいです。
お時間のある方は左ランキング欄も押していって下さると
もっともっとウレシイ!

  fc2rank

~PR~
スポンサーサイト
トラックバック
この記事のトラックバックURL
http://uroko.blog16.fc2.com/tb.php/54-f19d08fa
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。