掲示板でのタグの使い方

最近あちこちの掲示板で、カラフルな文字や大きな文字、
そして画像の貼付で盛り上がっています。
どうやったらあんな風に出来るんだろうとお悩みの方・・・参考にしてください。(^^)/

※ 他にもたくさんのHTMLタグがありますが、掲示板で使える代表的なタグを説明しました。
タグの使えない掲示板もありますのでご注意ください。
ここで指定記述、表示されている画像等はあくまでも例です、
各自で実行される場合は、正しい目的のアドレスを指定記述してください。

top

～最初に・・・タグを書くときの決まりです～
　　　　

タグの掟

　　　　１．タグは半角英数字を使って書く。

　　　　２．半角英数なら大文字でも小文字でもＯＫ。

　　　　３．タグは２つ１組で指定したい範囲をはさんで使う。

　　　　４．水平線や改行など、例外的に単独で使うタグもある。

　　　　５．タグにはサイズや色などさまざまなオプションを設定できる。

　　　　６．複数のタグを付けるときは、
　　　　　　<タグ１><タグ２><タグ３>文章</タグ３></タグ２></タグ１>
　　　　　　のように順番に入れ子にする。

　　　　７．下記の説明の中で、長いHTML文を見やすくするために
　　　　　　複数の段で書いた部分がありますが、
　　　　　　実際の書き込みは一段で書いてください。

それでは、上記のルールを守ってチャレンジしてください。(^^)d

こうなります	こう書きます
普通の文字での書き込みは普通に書きます。(^-^)	普通の文字での書き込みは普通に書きます。(^-^) ［ ※ コメントすることはありません。(^^;.... ］
太い文字私は太っています。文字の一部だけを、太字にする。	太い文字 <b>私は太っています。</b> 文字の一部だけを、<b>太字<b>にする。［ ※ 一部分を太字にするには<b>タグを使います。　　　 <b>とは「bold（ボールド・太字）」を意味します。］
斜めの文字私は傾いています。文字の一部だけを、斜体にする。	斜めの文字 <i>私は傾いています。</i> 文字の一部だけを、<i>斜体</i>にする。［ ※ 一部分を斜体にするには<i>タグを使います。　　　 <i>とは「italic（イタリック・斜体）」を意味します。］
太くて斜めの文字私は太っていて傾いています。文字の一部だけを、斜体の太字にする。	太くて斜めの文字 <b><i>私は太っていて傾いています。</i></b> 文字の一部だけを、<b><i>斜体の太字</i></b>にする。
大きな文字だっちゅうねんっ！	大きな文字 <font size="6">だっちゅうねんっ！</font> ［ ※ 標準サイズは3です、size="*" の数値が大きいと文字が大きくなります。］
小さな文字で chikuriちゃんに見つかりませんように・・・ボソボソボソと独り言	小さな文字で <font size=1>chikuriちゃんに見つかりませんように・・・ボソボソボソと独り言</font> ［ ※ 標準サイズは3です、size="*" の数値が小さいと文字が小さくなります。］
色付き文字色つきの女でいてくれぇ～♪	色付き文字 <font color="#ff00ff">色つきの女でいてくれぇ～♪</font> ［ ※HTMLではページの背景色や文字色の設定にも数値を使います。色の3原色である赤(Red)、緑(Green)、青(Blue)、それぞれの色に対応する十六進法を2桁ずつ並べ、「rrggbb」のように、先頭に#を加えて表記します。この方法で約1600万色の表現が可能です。］
こんな事も出来ます（kazuさんの部屋の壁紙）むしむしむしむしむしむしむし	こんな事も出来ます（kazuさんの部屋の壁紙） <font color="#00ffff">むし</font><font color="#00ff00">むし</font> <font color="#0000ff">むし</font><font color="#8000ff">むし</font> <font color="#804000">むし</font><font color="#ff8000">むし</font> <font color="#ff0000">むし</font> ［ ※ 大変長くなりますが、開けてびっくりカラフルな文字が並びます。］［ ※ 上記は４段で書いていますが、実際に書き込む時は１段で書いて下さい。］
色と大きさの変更を同時に行います。青くて大きな字	色と大きさの変更を同時に行います。 <font size="6" color="blue">青くて大きな字</font> ［ ※ １文字単位、または文章単位でサイズ、修飾、色などの設定を変えることが出来ます。］
大きな字で赤い字で太い字で斜めの字複数の設定を同時に指示	大きな字で赤い字で太い字で斜めの字 <b><i><font size="5" color="red">複数の設定を同時に指示</font></i></b>
改行タグで文章を区切って読みやすくします。この文章の次の文章を改行します。	改行タグで文章を区切って読みやすくします。この文章の次の文章を<br>改行します。［ ※ 掲示板投稿の場合、通常は<br>を使わずにEnterキーで改行出来ます。］
今までのタグを応用すると・・・ (^-^) こんな事も。（kazuさんのオリジナルです）むしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむし　　※ ある日あんこ嫌いの私の所に、　　kazuさんからあんこ攻撃がありました。　　私はあんこをむし（蒸し）に変えて、　　暑がりのkazuさんに報復しました。(^^)/	今までのタグを応用すると・・・ (^-^) こんな事も。（kazuさんのオリジナルです） <font color="#00ffff" size="3"><b>むし</b></font> <font color="#00ff00" size="3"><b>むし</b></font> <font color="#0000ff" size="3"><b>むし</b></font> <font color="#8000ff" size="3"><b>むし</b></font> <font color="#804000" size="3"><b>むし</b></font> <font color="#ff8000" size="3"><b>むし</b></font> <font color="#ff0000" size="3"><b>むし</b></font><br> <font color="#00ffff" size="4"><b>むし</b></font> <font color="#00ff00" size="4"><b>むし</b></font> <font color="#0000ff" size="4"><b>むし</b></font> <font color="#8000ff" size="4"><b>むし</b></font> <font color="#804000" size="4"><b>むし</b></font> <font color="#ff8000" size="4"><b>むし</b></font> <font color="#ff0000" size="4"><b>むし</b></font><br> <font color="#00ffff" size="5"><b>むし</b></font> <font color="#00ff00" size="5"><b>むし</b></font> <font color="#0000ff" size="5"><b>むし</b></font> <font color="#8000ff" size="5"><b>むし</b></font> <font color="#804000" size="5"><b>むし</b></font> <font color="#ff8000" size="5"><b>むし</b></font> <font color="#ff0000" size="5"><b>むし</b></font><br> <font color="#00ffff" size="6"><b>むし</b></font> <font color="#00ff00" size="6"><b>むし</b></font> <font color="#0000ff" size="6"><b>むし</b></font> <font color="#8000ff" size="6"><b>むし</b></font> <font color="#804000" size="6"><b>むし</b></font> <font color="#ff8000" size="6"><b>むし</b></font> <font color="#ff0000" size="6"><b>むし</b></font> ［ ※ いやいやここまでやったkazuさんに拍手ぅ～～！！。(^o^)//""" ］［ ※ 上記は複数の段で書いていますが、実際に書き込む時は１段で書いて下さい。］
文章の一部分に取り消し線を付けます。文章の一部分に~~取り消し線~~を付けます。（~~通常売価8900円~~）　akku-i特価2980円！！	文章の一部分に取り消し線を付けます。文章の一部分に<s>取り消し線</s>を付けます。（<s>通常売価8900円</s>）　akku-i特価2980円！！
文章の一部分に下線を付けます。文章の一部分に下線を付けます。	文章の一部分に下線を付けます。文章の一部分に<u>下線</u>を付けます。
指定した部分をクリックするだけで他のページや他所のURLなどにリンクを張ります。私の掲示板です。ここをクリック！是非遊びに来てください！	指定した部分をクリックするだけで他のページや他所のURLなどにリンクを張ります。私の掲示板です。 <a href="http://members11.tsukaeru.net/akku-i/cgi-bin/yybbs3/yybbs.cgi"> ここ</a>をクリック！是非遊びに来てください！［ ※ リンクの張られている部分は文字の色が変わり、下線が引かれます。］
kazuさん得意のMIDIの投稿も出来ます。上の「kazuさん」をクリックすると kazuさんのHPにジャンプするよ。まずは「おさかな天国」です。ここをクリックしてください。それからこんなことも出来ます。トトロを探して楽しく散歩「五月の村」です。	<a href="http://homepage2.nifty.com/christchurch/">kazuさん</a> 得意のMIDIの投稿も出来ます。上の「kazuさん」をクリックすると kazuさんのHPにジャンプするよ。まずは「おさかな天国」です。 <a href="http://members11.tsukaeru.net/akku-i/midi/osakanatengoku.mid"> ここ</a>をクリックしてください。それからこんなことも出来ます。トトロを探して楽しく散歩 <embed src="http://members11.tsukaeru.net/akku-i/midi/gogatu.mid" width="100" height="30" autostart="false" loop="-1">「五月の村」です。
画像の貼付です。	画像の貼付です。 <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /sam_photo/kadan-1.jpg" height="112" width="149"> ［ ※ オリジナルの画像のまま幅と高さを変えて貼ることも出来ますが、オリジナルのサイズが大きすぎるとページの表示を遅くする原因になります。掲示板に表示したいサイズに縮小してから貼りましょう。その場合、タグに画像の幅と高さの指定がなくても表示されますが指定することによりページの表示を早めることが出来るので忘れずに記述しましょう。縦横の比率を間違えないように。］
既に書いたことの応用ですが、貼った画像をクリックして大きな画像を表示させることも出来ます。	既に書いたことの応用ですが、貼った画像をクリックして大きな画像を表示させることも出来ます。 <a href="http://members11.tsukaeru.net/akku-i/akku-i_files /photo/ageha.jpg" height="480" width="640"> <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /sam_photo/ageha-1.jpg" height="112" width="149" border=0></a> ［ ※ お気づきかも知れませんが、貼られている画像とクリックして大きくなった画像は違うものです。もちろん画像の幅と高さを指定することにより同じ画像を使用することも出来ます。画像を右クリックしてプロパティを開いてみてください。画像の場所、名前、サイズを確認することが出来ます。ここに貼った画像も元々は同じ画像ですが、貼られた画像はサイズの変更、大きい画像はアゲハの周りを切り取る＋サイズの変更がされています。］
当然、まったく違うもの同士を関連付ける事も出来ます。リンクの部屋からバナーをクリックするのと同じです。下のバナーをクリックすると夢見さんのHP「夢見っぴあ」にジャンプします。	当然、まったく違うもの同士を関連付ける事も出来ます。リンクの部屋からバナーをクリックするのと同じです。下のバナーをクリックすると夢見さんのHP「夢見っぴあ」にジャンプします。 <a href="http://members7.tsukaeru.net/yumemi/"> <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /yumemi1.gif" height="31" width="88" border=0></a> ［ ※ ここに貼ったバナーは、夢見さんが気ままママさんに作ってもらったものです］
原稿をそのまま表示させる方法です。 ★彡 ★彡★彡 ★彡☆彡★彡 ★彡★彡★彡★彡 ☆メリークリスマス☆	原稿をそのまま表示させる方法です。 <pre> 　　　　　　　　　★彡　　　　　　　　　★彡★彡　　　　　　　　　★彡☆彡★彡　　　　　　　　　★彡★彡★彡★彡　　　　　　　　　☆メリークリスマス☆ </pre> ［ ※ 文字で作った横長の表や、画像イメージなどをくずしたくない場合に使います。］

こうなります	こう書きます
普通の文字での書き込みは普通に書きます。(^-^)	普通の文字での書き込みは普通に書きます。(^-^) ［ ※ コメントすることはありません。(^^;.... ］
太い文字私は太っています。文字の一部だけを、太字にする。	太い文字 <b>私は太っています。</b> 文字の一部だけを、<b>太字<b>にする。［ ※ 一部分を太字にするには<b>タグを使います。　　　 <b>とは「bold（ボールド・太字）」を意味します。］
斜めの文字私は傾いています。文字の一部だけを、斜体にする。	斜めの文字 <i>私は傾いています。</i> 文字の一部だけを、<i>斜体</i>にする。［ ※ 一部分を斜体にするには<i>タグを使います。　　　 <i>とは「italic（イタリック・斜体）」を意味します。］
太くて斜めの文字私は太っていて傾いています。文字の一部だけを、斜体の太字にする。	太くて斜めの文字 <b><i>私は太っていて傾いています。</i></b> 文字の一部だけを、<b><i>斜体の太字</i></b>にする。
大きな文字だっちゅうねんっ！	大きな文字 <font size="6">だっちゅうねんっ！</font> ［ ※ 標準サイズは3です、size="*" の数値が大きいと文字が大きくなります。］
小さな文字で chikuriちゃんに見つかりませんように・・・ボソボソボソと独り言	小さな文字で <font size=1>chikuriちゃんに見つかりませんように・・・ボソボソボソと独り言</font> ［ ※ 標準サイズは3です、size="*" の数値が小さいと文字が小さくなります。］
色付き文字色つきの女でいてくれぇ～♪	色付き文字 <font color="#ff00ff">色つきの女でいてくれぇ～♪</font> ［ ※HTMLではページの背景色や文字色の設定にも数値を使います。色の3原色である赤(Red)、緑(Green)、青(Blue)、それぞれの色に対応する十六進法を2桁ずつ並べ、「rrggbb」のように、先頭に#を加えて表記します。この方法で約1600万色の表現が可能です。］
こんな事も出来ます（kazuさんの部屋の壁紙）むしむしむしむしむしむしむし	こんな事も出来ます（kazuさんの部屋の壁紙） <font color="#00ffff">むし</font><font color="#00ff00">むし</font> <font color="#0000ff">むし</font><font color="#8000ff">むし</font> <font color="#804000">むし</font><font color="#ff8000">むし</font> <font color="#ff0000">むし</font> ［ ※ 大変長くなりますが、開けてびっくりカラフルな文字が並びます。］［ ※ 上記は４段で書いていますが、実際に書き込む時は１段で書いて下さい。］
色と大きさの変更を同時に行います。青くて大きな字	色と大きさの変更を同時に行います。 <font size="6" color="blue">青くて大きな字</font> ［ ※ １文字単位、または文章単位でサイズ、修飾、色などの設定を変えることが出来ます。］
大きな字で赤い字で太い字で斜めの字複数の設定を同時に指示	大きな字で赤い字で太い字で斜めの字 <b><i><font size="5" color="red">複数の設定を同時に指示</font></i></b>
改行タグで文章を区切って読みやすくします。この文章の次の文章を改行します。	改行タグで文章を区切って読みやすくします。この文章の次の文章を<br>改行します。［ ※ 掲示板投稿の場合、通常は<br>を使わずにEnterキーで改行出来ます。］
今までのタグを応用すると・・・ (^-^) こんな事も。（kazuさんのオリジナルです）むしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむしむし　　※ ある日あんこ嫌いの私の所に、　　kazuさんからあんこ攻撃がありました。　　私はあんこをむし（蒸し）に変えて、　　暑がりのkazuさんに報復しました。(^^)/	今までのタグを応用すると・・・ (^-^) こんな事も。（kazuさんのオリジナルです） <font color="#00ffff" size="3"><b>むし</b></font> <font color="#00ff00" size="3"><b>むし</b></font> <font color="#0000ff" size="3"><b>むし</b></font> <font color="#8000ff" size="3"><b>むし</b></font> <font color="#804000" size="3"><b>むし</b></font> <font color="#ff8000" size="3"><b>むし</b></font> <font color="#ff0000" size="3"><b>むし</b></font><br> <font color="#00ffff" size="4"><b>むし</b></font> <font color="#00ff00" size="4"><b>むし</b></font> <font color="#0000ff" size="4"><b>むし</b></font> <font color="#8000ff" size="4"><b>むし</b></font> <font color="#804000" size="4"><b>むし</b></font> <font color="#ff8000" size="4"><b>むし</b></font> <font color="#ff0000" size="4"><b>むし</b></font><br> <font color="#00ffff" size="5"><b>むし</b></font> <font color="#00ff00" size="5"><b>むし</b></font> <font color="#0000ff" size="5"><b>むし</b></font> <font color="#8000ff" size="5"><b>むし</b></font> <font color="#804000" size="5"><b>むし</b></font> <font color="#ff8000" size="5"><b>むし</b></font> <font color="#ff0000" size="5"><b>むし</b></font><br> <font color="#00ffff" size="6"><b>むし</b></font> <font color="#00ff00" size="6"><b>むし</b></font> <font color="#0000ff" size="6"><b>むし</b></font> <font color="#8000ff" size="6"><b>むし</b></font> <font color="#804000" size="6"><b>むし</b></font> <font color="#ff8000" size="6"><b>むし</b></font> <font color="#ff0000" size="6"><b>むし</b></font> ［ ※ いやいやここまでやったkazuさんに拍手ぅ～～！！。(^o^)//""" ］［ ※ 上記は複数の段で書いていますが、実際に書き込む時は１段で書いて下さい。］
文章の一部分に取り消し線を付けます。文章の一部分に~~取り消し線~~を付けます。（~~通常売価8900円~~）　akku-i特価2980円！！	文章の一部分に取り消し線を付けます。文章の一部分に<s>取り消し線</s>を付けます。（<s>通常売価8900円</s>）　akku-i特価2980円！！
文章の一部分に下線を付けます。文章の一部分に下線を付けます。	文章の一部分に下線を付けます。文章の一部分に<u>下線</u>を付けます。
指定した部分をクリックするだけで他のページや他所のURLなどにリンクを張ります。私の掲示板です。ここをクリック！是非遊びに来てください！	指定した部分をクリックするだけで他のページや他所のURLなどにリンクを張ります。私の掲示板です。 <a href="http://members11.tsukaeru.net/akku-i/cgi-bin/yybbs3/yybbs.cgi"> ここ</a>をクリック！是非遊びに来てください！［ ※ リンクの張られている部分は文字の色が変わり、下線が引かれます。］
kazuさん得意のMIDIの投稿も出来ます。上の「kazuさん」をクリックすると kazuさんのHPにジャンプするよ。まずは「おさかな天国」です。ここをクリックしてください。それからこんなことも出来ます。トトロを探して楽しく散歩「五月の村」です。	<a href="http://homepage2.nifty.com/christchurch/">kazuさん</a> 得意のMIDIの投稿も出来ます。上の「kazuさん」をクリックすると kazuさんのHPにジャンプするよ。まずは「おさかな天国」です。 <a href="http://members11.tsukaeru.net/akku-i/midi/osakanatengoku.mid"> ここ</a>をクリックしてください。それからこんなことも出来ます。トトロを探して楽しく散歩 <embed src="http://members11.tsukaeru.net/akku-i/midi/gogatu.mid" width="100" height="30" autostart="false" loop="-1">「五月の村」です。
画像の貼付です。	画像の貼付です。 <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /sam_photo/kadan-1.jpg" height="112" width="149"> ［ ※ オリジナルの画像のまま幅と高さを変えて貼ることも出来ますが、オリジナルのサイズが大きすぎるとページの表示を遅くする原因になります。掲示板に表示したいサイズに縮小してから貼りましょう。その場合、タグに画像の幅と高さの指定がなくても表示されますが指定することによりページの表示を早めることが出来るので忘れずに記述しましょう。縦横の比率を間違えないように。］
既に書いたことの応用ですが、貼った画像をクリックして大きな画像を表示させることも出来ます。	既に書いたことの応用ですが、貼った画像をクリックして大きな画像を表示させることも出来ます。 <a href="http://members11.tsukaeru.net/akku-i/akku-i_files /photo/ageha.jpg" height="480" width="640"> <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /sam_photo/ageha-1.jpg" height="112" width="149" border=0></a> ［ ※ お気づきかも知れませんが、貼られている画像とクリックして大きくなった画像は違うものです。もちろん画像の幅と高さを指定することにより同じ画像を使用することも出来ます。画像を右クリックしてプロパティを開いてみてください。画像の場所、名前、サイズを確認することが出来ます。ここに貼った画像も元々は同じ画像ですが、貼られた画像はサイズの変更、大きい画像はアゲハの周りを切り取る＋サイズの変更がされています。］
当然、まったく違うもの同士を関連付ける事も出来ます。リンクの部屋からバナーをクリックするのと同じです。下のバナーをクリックすると夢見さんのHP「夢見っぴあ」にジャンプします。	当然、まったく違うもの同士を関連付ける事も出来ます。リンクの部屋からバナーをクリックするのと同じです。下のバナーをクリックすると夢見さんのHP「夢見っぴあ」にジャンプします。 <a href="http://members7.tsukaeru.net/yumemi/"> <img src="http://members11.tsukaeru.net/akku-i/akku-i_files /yumemi1.gif" height="31" width="88" border=0></a> ［ ※ ここに貼ったバナーは、夢見さんが気ままママさんに作ってもらったものです］
原稿をそのまま表示させる方法です。 ★彡 ★彡★彡 ★彡☆彡★彡 ★彡★彡★彡★彡 ☆メリークリスマス☆	原稿をそのまま表示させる方法です。 <pre> 　　　　　　　　　★彡　　　　　　　　　★彡★彡　　　　　　　　　★彡☆彡★彡　　　　　　　　　★彡★彡★彡★彡　　　　　　　　　☆メリークリスマス☆ </pre> ［ ※ 文字で作った横長の表や、画像イメージなどをくずしたくない場合に使います。］