ホーム Bfitとは 料金プラン 機能紹介 お申込み マニュアル ログイン ドメイン SSL
クレジット決済などお支払いも簡単・便利!詳細>>お支払方法

レンタルサーバーマニュアル スタートアップ


ホームページ作成方法
HP作成A HP作成B HP作成C HP作成D HP作成E HP転送F


19. テーブルタグの応用
「11.<table>タグを覚えよう!」で覚えた<table>タグ。これを応用して自由自在にテーブルを操りましょう!

▼練習用のホームページに使ったテーブルです。
<table border="2" width="80%">
<tr>
<td>1行目の1コマ目</td>
<td>1行目の2コマ目</td>
</tr>
<tr>
<td>2行目の1コマ目</td>
<td>2行目の2コマ目</td>
</tr>
<tr>
<td>3行目の1コマ目</td>
<td>3行目の2コマ目</td>
</tr>
</table>
 
1行目の1コマ目 1行目の2コマ目
2行目の1コマ目 2行目の2コマ目
3行目の1コマ目 3行目の2コマ目
▼線の太さを4に、幅を100%に、1行3列にテーブルを変更した例です。
<table border="4" width="100%">
<tr>
<td>1行目の1コマ目</td>
<td>1行目の2コマ目</td>
<td>1行目の3コマ目</td>
</tr>
<tr>
<td>2行目の1コマ目</td>
<td>2行目の2コマ目</td>
<td>2行目の3コマ目</td>
</tr>
</table>
 
1行目の1コマ目 1行目の2コマ目 1行目の3コマ目
2行目の1コマ目 2行目の2コマ目 2行目の3コマ目
▼線の太さを0に、幅の指定をなくし、3行1列にテーブルを変更した例です。
<table border="0">
<tr>
<td>1行目の1コマ目</td>
</tr>
<tr>
<td>2行目の1コマ目</td>
</tr>
<tr>
<td>3行目の1コマ目</td>
</tr>
</table>
 
1行目の1コマ目
2行目の1コマ目
3行目の1コマ目


20. フォントタグの応用
「11.<table>タグを覚えよう!」で覚えた<table>タグ。これを応用して自由自在にテーブルを操りましょう!

▼練習用のホームページに使ったテーブルです。
<B><FONT size="+1" color="red">What's New !!!</FONT></B>   What's New !!!
▼文字サイズを-1に、文字の色を緑に、太字を斜体に変更した例です。
<I><FONT size="-1" color="green">What's New !!!</FONT></I>   What's New !!!
▼文字サイズを+3に、文字の色を指定せず、斜体に変更した例です。
<I><B><FONT size="+3">What's New !!!</FONT></B></I>   What's New !!!


21. オリジナリティ溢れたホームページを!
練習用のホームページ制作で覚えた様々な知識。それを応用するだけでもホームページ制作の幅は広がりますが、タグは他にもたくさんあります。一度にたくさん覚える必要は全くありません。少しづつで良いのでホームページ制作の知識を身に付け、よりよいホームページを制作してみて下さい!

最後にホームページ制作に使えるテンプレートもご用意しておりますので、そちらも是非ご利用下さい。それでは「E.テンプレートも活用してみよう」へGO!


前へ次へ

ページトップへ