ブログ作成に必要な基本的なＨＴＭＬタグについて説明してます！（ＨＴＭＬ フォント レイアウト リンク・画像 テーブルなど）

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


テーブルタグ


表の後ろに影を付けるの説明と例



※ 文字や数字を入れる際は半角英数字で入力して下さい！


カラーコードについてはカラーコード（色見本）を見て好きな色のコードをマウスでコピーして貼り付けて下さい！


表の後ろに影を付けるの例

A B C
D E F
G H I

上の表のHTMLタグ
<table cellspacing="0" cellpadding="0" width="120">
<tr>
<td width="5" height="5" bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF"></td>
<td width="5"></td>
</tr>
<tr>
<td bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF">A</td>
<td bgcolor="#99BAFF">B</td>
<td bgcolor="#99BAFF">C</td>
<td bgcolor="#cccccc"></td>
</tr>
<tr>
<td bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF">D</td>
<td bgcolor="#99BAFF">E</td>
<td bgcolor="#99BAFF">F</td>
<td bgcolor="#cccccc"></td>
</tr>
<tr>
<td bgcolor="#99BAFF"></td>
<td bgcolor="#99BAFF">G</td>
<td bgcolor="#99BAFF">H</td>
<td bgcolor="#99BAFF">I</td>
<td bgcolor="#cccccc"></td>
</tr>
<tr>
<td height="5"></td>
<td bgcolor="#cccccc"></td>
<td bgcolor="#cccccc"></td>
<td bgcolor="#cccccc"></td>
<td bgcolor="#cccccc"></td>
</tr>
</table>

セルとセル間隔0内側の余白0幅を120に指定、メインの色は薄いブルー(#99BAFF)、影はグレー(#cccccc)

※　解りやすくするため上のHTMLタグには実際の色より濃い色を付けて表示してます！　又、色を選択する際は色の濃さに注意して下さい！（上手に表示されない場合があるので）

※ 表の縦横幅を指定した場合、入れる文字数によっては表示が上手くいかない場合があるので上手く調整して下さい！！


表示の確認はHTMLタグ練習ページを使うと簡単に確認できるので活用して下さい！


カラーコードについてはカラーコード（色見本）を見て好きな色のコードをマウスでコピーして貼り付けて下さい！


スポンサード　リンク



おまけ応用例（枠線なしと枠線あり）

A B C D
E F G H
I J K L
M N O P

枠線が無い場合

A B C D
E F G H
I J K L
M N O P

枠線あり線の太さ1の場合

A B C D
E F G H
I J K L
M N O P

枠線あり線の太さ10の場合

A B
E F G
J K L
O P

C、D、H、I、M、N を消した場合
上の表のHTMLタグ
<Table width="280" height="125" border="0〜10" cellspacing="0">
<tr>
<td bgcolor="#6295ff">A</td>
<td bgcolor="#6295ff">B</td>
<td>C</td>
<td>D</td>
</tr>
<tr>
<td bgcolor="#6295ff">E</td>
<td bgcolor="#6295ff">F</td>
<td bgcolor="#99BAFF">G</td>
<td>H</td>
</tr>
<tr>
<td>I</td>
<td bgcolor="#99BAFF">J</td>
<td bgcolor="#99BAFF">K</td>
<td bgcolor="#cedeff">L</td>
</tr>
<tr>
<td>M</td>
<td>N</td>
<td bgcolor="#cedeff">O</td>
<td bgcolor="#cedeff">P</td>
</tr>
</Table>

表の縦横幅と線の太さは自由に変更して下さい！

横幅を280に縦幅を125に線の太さは0、1、10に指定してみました。

※ 表の縦横幅を指定した場合、入れる文字数によっては（改行されるので）思うように表示ができない場合があるので上手く調整して下さい！！


いろいろ設定を変えることで上の表のように表情がかなり変わります。

HTMLタグ練習ページで設定を変えて作成してみましょう！！


表示の確認は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) 初心者のブログ作成 ＨＴＭＬタグ研究所！ All Rights Reserved. |