ブログ作成に必要な基本的なHTMLタグについて説明してます!(HTML フォント レイアウト リンク・画像 テーブルなど)

初心者のブログ作成 HTMLタグ研究所! サイト マップ お問い合せ LINK
HTMLタグの他にPC・インターネット関連用語集や便利なショートカットキー一覧 ・ 無料で利用できる便利なサイトも紹介してるのでゆっくり見て下さい!


テーブルタグ


縦の連結と横の連結の説明と例


<td rowspan="縦の行数">文字</td> 

数字を入れる際は半角英数字で入力して下さい!


縦の連結の例

A B C D
E F G
H I J

上の表のHTMLタグ
<table border>
<tr>
<td rowspan="3">A</td><td>B</td><td>C</td><td>D</td>
</tr>
<tr>
<td>
E</td><td>F</td><td>G</td>
</tr>
<tr>
<td>
H</td><td>I</td><td>J</td>
</tr>
</table>

Aの縦の行数3行に指定したので2列目のBEHと連結することが出来ます!


HTMLタグ練習ページで連結する位置を確かめながら作成するとテンプレートなどが作れます!


他のページで紹介している<Table>タグを組み合わせるともっと見やすい表が作れるので挑戦してみて下さい。



<td colspan="横の列数">文字</td> 

数字を入れる際は半角英数字で入力して下さい!


横の連結の例1

A B C D
E F G H I

上の表のHTMLタグ
<table border>
<tr>
<td colspan="2">A</td><td>B</td><td>C</td><td>D</td>
</tr>
<tr>
<td>
E</td><td>F</td><td>G</td><td>H</td><td>I</td>
</tr>
</table>

Aの
横の列数2列に指定したので2行目のEFと連結することが出来ます!


HTMLタグ練習ページで連結する位置を確かめながら作成するとテンプレートなどが作れます!


他のページで紹介している<Table>タグを組み合わせるともっと見やすい表が作れるので挑戦してみて下さい。


<td colspan="横の列数">文字</td> 

数字を入れる際は半角英数字で入力して下さい!


スポンサード リンク



横の連結の例2

A
B C D E F G H I

上の表のHTMLタグ
<table border>
<tr>
<td colspan="8">A</td>
</tr>
<td>B</td><td>C</td><td>D</td><td>E</td>
<td>F</td><td>G</td><td>H</td><td>I</td>
</tr>
</table>

Aの
横の列数8列に指定したので2行目のBCDEFGHIと連結することが出来ます!


HTMLタグ練習ページで連結する位置を確かめながら作成するとテンプレートなどが作れます!



他のページで紹介している<Table>タグを組み合わせるともっと見やすい表が作れるので挑戦してみて下さい。



スポンサード リンク


縦と横の連結の応用編

a b c d 1
e f g 2 3 4 5 6
A
B C D E F G H I

上の表のHTMLタグ
<table border>
<tr>
<td rowspan="4">a</td><td>b</td><td>c</td><td>d</td>
<td colspan="
5">1</td>
</tr>
<tr>
<td>
e</td><td>f</td><td>g</td>
<td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
</tr>
<td colspan="8">
A</td>
</tr>
<td>
B</td><td>C</td><td>D</td><td>E</td>
<td>
F</td><td>G</td><td>H</td><td>I</td>
</tr>
</table>

表は9列4行の表を使用



一列目aの縦の行数を4行に指定したのでbeABと連結


次に5列1行目の1の横の列数5に指定したので5列2行目の23456と連結


最後に2列3行目
Aの横の列数を8に指定したのでBCDEFGHIと連結


この表は上で紹介した例の3つの表を組み合わせただけの単純なものですが他のページで紹介している<Table>タグを組み合わせるともっと複雑な表が作れるので挑戦してみて下さい!


HTMLタグ練習ページで連結する位置を確かめながら作成するとテンプレートなどが作れます!




HTMLタグを使う場合の注意点!

HTMLタグを使う場合の入力方法は半角英数字です。 基本となるHTMLタグはコピー・貼り付けで構いませんがサイズ・カラーコード・アドレスなどの数字や文字を入力する場合に半角英数字以外の文字で入力すると正しく表示されないので注意して下さい!

また、HTMLタグを入力する際は半角英数字ですが大文字と小文字の区別は無いので気にしないで下さい。

HTMLタグには
開始タグ終了タグがあります。

例)<Font Size="1〜7">〜</Font> 最初の
<Font Size="1〜7">が開始タグで後の/スラッシュが付いた</Font>が終了タグになります。 終了タグを入れ忘れた場合ページのレイアウトが崩れることがあるので気をつけましょう!

その他に、基本のHTMLタグの
<>←カッコ、"←ダブル クォーテーションやHTMLタグ内の記号・文字・数字などを消したり、スペースを空けたり・くっつけたり、改行したりするとHTMLタグが正しく表示されないので注意して下さい。

上記のミスが非常に多いので作成の際はPCのメモ帳などを利用してHTMLタグの見直しをして下さい。

また、正しく表示できない場合も
基本のHTMLタグやここで説明した内容を確認してみて下さい!

HTMLタグは最初は見なれない文字や記号が多いので意味が解らないと思いますが使用しているうちになれて読めるようになります。 少しずつ落ち着いて作業して下さい!


Copyright (C) 初心者のブログ作成 HTMLタグ研究所! All Rights Reserved. |