作成者 : 薬学部 石塚 忠男 tstone@gpo.kumamoto-u.ac.jp 題名 : Webページ（ホームページ）の書き方 Time-stamp: <2001-03-06 16:14:44 t-kita> # タイトル : (ブラウザのタイトルバーに表示) #title Webページ（ホームページ）の書き方 # ヘッダの定義 : #header # フッタの定義 : #footer # ----- # ０枚目はブランクにする -------------------- HTML1.html ここから --------------------= HTMLとは
　HTMLとは、Hyper Text Markup Language の略称であり、webページを記述するための言語です。簡単に言えば「webページの書き方」です。
　通常webページにアクセスしますと、テキスト（文字データ）だけでなく、画像、音声などが目に入ってきますが、これは、HTMLで書かれている「どのようなデータをどのように配置・表示するか」、すなわちwebページの体裁を整えるための記述、に従ってwebブラウザー（インターネットエクスプローラーやネットスケープなど）が作り上げたものです。この記述のことを「ソース」と言い、webサーバーからインターネットなどを経由してあなたのコンピュータが受け取り、ブラウザを用いて見ているわけです。
　ですから、「webページを作る」と言った場合、テキストや画像などの素材を集めることのほかに、HTMLを使ってソースを作る、ということをしなくてはなりません。ソースの中では「タグ」と呼ばれる＜＞で囲まれた記述でwebページの体裁を指定します。つまり、この「タグの使い方」を学ぶことが、webページ作りの第一歩となるわけです。
　現在ブラウザで見ているページのソースは、ブラウザのメニューの「ソースを見る」などのコマンドを使うことで見ることができます。表示するテキストとタグが混ざり合って表示されますから決して見やすいものではありませんが、ワープロなどの特定のソフトに依存せずに、世界共通のフォーマットで書かれているために、ブラウザさえあれば世界中どこでも見ることができます。ただし、タグをどう解釈し、表示するかは、各ブラウザの設定によって微妙に異なるので、どこでも「完全に同じように」見えるわけではありません。

以下に、その「ソース作り」に関して簡単に説明します。
-------------------- HTML2.html ここから --------------------= ・ファイルについて
　ソースの書かれたファイルは、ワープロなどの特定のアプリケーションのファイルではなく、テキストファイルです。Windowsであれば「メモ帳」、Macintoshであれば「SimpleText」などのテキストエディターで開いて編集することが可能です。ファイル名の後には、「.html」か「.htm」という拡張子をつけるのが普通です。ブラウザソフトで、このファイルを開くと、ソースを「プレヴュー」することが出来ます。また、ファイル名は、英数字でつけましょう。日本語名でもプレヴューは出来るのですが、OSによっては、認識しない場合があります。 -------------------- HTML3.html ここから --------------------= ・HTMLファイルの構成
　タグを使ってソースを記述しているHTMLファイルですが、基本的な構成としては

　<HTML>
　<HEAD>
　・・・・・・
　<TITLE>・・・・・</TITLE>
　・・・・・・
　</HAED>
　<BODY>
　・・・・・・
　</BODY>
　</HTML>

の様になっています。タグは、<aaaaa></aaaaa>のように、前後２つで対になっているものが多いです。

<HTML>・・・・</HTML>　は、「・・・・」の部分がHTMLで書かれていることの宣言です。省略しても（現在のところ）ブラウザは表示をしてくれますが、キチンと書いておくことを勧めます。

<HEAD>・・・・</HEAD>　は、ファイルの情報を記述する領域です。例えば、タイトル、作者名、作成日、文字コード情報などです。（現在のところ）記述しなくても特に問題はなく、単にドキュメントを見やすく整理するためのものであるといえます。

<TITLE>・・・・</TITLE>は、タイトル名を意味します。「・・・・」に書かれた内容が、ブラウザで開いたときのウィンドウのタイトルバーに表示されます。

<BODY>・・・・</BODY>　は、「・・・・」の部分が本文であることを示します。省略可能ですが、<HEAD></HEAD>と区別するために、キチンと書いておくことを勧めます。
この<BODY>タグのオプションとして
<BODY TEXT="色の名前">・・・・・・・・・・そのページの文字の色を指定
<BODY BGCOLOR="色の名前">・・・・・・・・そのページの背景色を指定
<BODY BACKGROUND="画像ファイル名">・・・そのページの背景に貼り付ける画像の指定
が、あります（色の名前の指定法、画像ファイル名については後述）

　このような基本構成のもとで、<BODY>と</BODY>の間に、さまざまなタグを用いてソースを記述していきます。
-------------------- HTML4.html ここから --------------------= レイアウトについて

・強制改行
HTMLでは、「改行」というのは指定してやらないとしません。
ブラウザのウィンドウの右端にいけば折り返しますが、それ以外で改行をしたいときは「<BR>」タグで指定をします。
（例）あいうえお<BR>
かきくけこ<BR>
さしすせそ<BR>
たちつてと<BR>

とHTMLを書きますと
あいうえお
かきくけこ
さしすせそ
たちつてと

と表示されます。

・改行禁止
改行させたくないときは「<NOBR>〜</NOBR>」と文字列をタグで指定します。

（例）
<NOBR>あいうえおかきくけこさしすせそ
たちつてとなにぬねのはひふへほ
まみむめもやゐゆゑよわん
あいうえおかきくけこさしすせそ
たちつてとなにぬねのはひふへほ
まみむめもやゐゆゑよわん</NOBR>
とソースを書くと

あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゐゆゑよわんあいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゐゆゑよわん

と表示されます。

・行揃え
文字列（・・・・）の、「左寄せ、中央寄せ、右寄せ」を指定することができます。

例えば <p align="left"">左寄せ</p"><BR>
<p align="center"">中央寄せ</p"><BR>
<p align="right"">右寄せ</p"><BR>

とソースを書くと

左寄せ

中央寄せ

右寄せ


と表示されます。

・整形済みテキストの表示
ワープロなどで作成した文字列を「そのまま」表示したいときに、「<PRE">・・・・</PRE">」を使います。

<PRE>
あ
　い
　　う
　　　え
　　　　お</PRE>

とHTML書けば 
あ
　い
　　う
　　　え
　　　　お

と表示されます -------------------- HTML5.html ここから --------------------= ・文字飾りなど
　ワープロソフトなどで文字にかけることが出来る効果とほとんど同じものが、タグで指定することによりかけられます。

<FONT SIZE=n >・・・・</FONT>
「・・・・」の文字サイズを指定します。
ｎが文字の大きさを表わします。１から７まであり、７が一番大きいです。ブラウザが標準で指定しているフォントサイズを基準にして文字サイズが決まるので、絶対的なものではありません。
　なお、<Hn >〜</Hn>　は「見出し文字のサイズ」の指定で、ｎでサイズの指定をするところは似ていますが、１が一番大きく６が一番小さいところは逆なので注意が必要です。また、見出しなので、太文字になり、改行もされます。

<FONT COLOR="色の名前">・・・・・</FONT>
「・・・・」の文字色を指定することが出来ます。
（色の指定法はこちら）

<B>・・・・</B>
「・・・・」の文字を太文字で表示します。
「<B>太文字</B>」とソースを書けば、「太文字」と表示されます。

<I>・・・・</I>
「・・・・」の文字を斜体で表示します。
「<I>イタリックス</I>」とHTML書けば、「イタリックス」と表示されます。

<SUP>・・・・</SUP>
文字の肩に文字をのせられます。（上付き文字）
「X<SUP>y</SUP> 」 とHTMLを書けば、Xy と表示されます。

<SUB>・・・・</SUB>
下付き文字を指定できます
化学式の様なものを書くときに重宝します。
「Na<sub>2</sub>SO<sub>4</sub>」とHTMLを書くと「Na2SO4」と表示されます。 -------------------- HTML6.html ここから --------------------= ・色の指定について

　色は「#RRGGBB」というように、「#」の後に６ケタの色コードを付けて指定します。これは、「RR」「GG」「BB」それぞれ、赤・緑・青の色の濃さを0〜255の範囲で指定し、２ケタの16進数で記述したものです。
　たとえば、黒は「#000000」、赤は「#FF0000」、白は「#FFFFFF」などです。具体的な色の例を下に示します。光の三原色である、赤・緑・青の三色についてそれぞれ256段階を指定するので、全部で256x256x256=16777216色が作れる計算になります。実際には、様々なソフトで、色コードを調べることができます。

　 #FFFFFF #EEEEEE #DDDDDD #CCCCCC" #BBBBBB #AAAAAA #999999 #888888 #777777 #666666 #555555 #444444 #333333 #222222 #111111
#3D0000 #3D1400 #3D2700 #3D3B00 #283D00 #0F3D00 #003D08 #003D20 #003D38 #002B3D #00153D #00003D #1E003D #3C003D #3D0020 #3D0017
#590000 #591D00 #593900 #595600 #395900 #175900 #00590B #00592E #005951 #003F59 #001F59 #000059 #2B0059 #570059 #59002F #590021
#750100 #752600 #754B00 #757100 #4B7500 #1E7500 #00750F #00753C #00756A #005275 #002975 #000075 #390075 #720075 #75003E #75002C
#910100 #752600 #915D00 #918B00 #5D9100 #259100 #009113 #00914B #009183 #006691 #003391 #000091 #470091 #8E0091 #91004C #910036
#C80100 #912F00 #AC6F00 #ACA600 #6FAC00 #2CAC00 #00AC16 #00AC59 #00AC9C #007AAC #003DAC #0000AC #5400AC #A900AC #AC005B #AC0040
#E40200 #AC3800 #C88100 #C8C100 #81C800 #33C800 #00C81A #00C868 #00C8B5 #008DC8 #0046C8 #0000C8 #6200C8 #C400C8 #C8006A #C8004B
#E40200 #C84100 #E4930 #E4DB00 #93E400 #3AE400 #00E41E #00E476 #00E4CE #00A1E4 #0050E4 #0000E4 #6F00E4 #DF00E4 #C8006A #E40055
#FF0200 #E44A00 #FFA500 #FFF600 #A5FF00 #41FF00 #00FF22 #20FF94 #00FFE7 #00B4FF #005AFF #0000FF #7D00FF #FA00FF #FF0087 #FF0060
#FF2220 #FF5300 #FFB020 #FFF720 #B0FF20 #59FF20 #20FF3D #20FF94 #20FFEA #20BEFF #206FFF #2020FF #8D20FF #FB20FF #FF2096 #FF2074
#FF413F #FF6920 #FFBB3F #FFF83F #C7FF5F #71FF3F #3FFF59 #3FFFA3 #3FFFED #3FC7FF #3F83FF #3F40FF #9E3FFF #FC3FFF #FF3FA5 #FF3F88
#FF615F #FF7E3F #FFC75F #FFFA5F #C7FF5F #89FF5F #5FFF75 #5FFFB3 #5FFFF0 #5FD1FF #5F98F #5F60FF #AE5FFF #FC5FFF #FF5FB4 #FF5F9C
#FF7D7A #FF945F #FFD27F #FFFB7F #D2FF7F #A0FF7F #7FFF90 #7FFFC2 #7FFFF3 #7FDAFF #7FADFF #7F7FFF #BE7FFF #FD7FFF #FF7FC3 #FF7FB0
#FFA09F #FFA97F #FFDD9F #FFFC9F #DEFF9F #B8FF9F #9FFFAC #9FFFD1 #9FFFF6 #9FE3FF #9FC1FF #9F9FFF #CF9FFF #FE9FFF #FF9FD2 #FF7FB0
#FFC0BF #FFD4BF #FFE9BF #FFFDBF #E9FFBF #D0FFBF #BFFFC8 #BFFFE1 #BFFFF9 #BFEDFF #BFD6FF #BFBFFF #DFBFFF #FEBFFF #FFBFE1 #FFBFD7
#FFDAD9 #FFEADF #FFF6E1 #FFFEDF #F4FFDF #E8FFDF #D4FFDB #E1FFF0 #E1FFFC #DFF6FF #DFF6FF #DFDFFF #EFDFFF #FFE1FF #FFDFF0 #FFDFEB
-------------------- HTML7.html ここから --------------------= ・リンクについて
ファイル間リンク
<A HREF="リンク先ファイル名"></A>とソースを書くと、表示されるときは「リンク先ファイル名」が他の文字と異なった色（ブラウザの設定によって違います。）で表示され、マウスでクリックすると、リンク先として指定したページが表示されます。

ファイル内リンク
<A HREF="#ラベル"></A>　　　<A name="ラベル"></A>
　これは、同一ファイル内でのリンクです。ページ内に<A name="">タグで「ラベル名」を設定しておくと、そのラベルの位置にリンクを張ることが出来ます。長いページ中で、最初の部分においた「目次」と各項目の間で使うと便利です。
たとえば

目次
<A HREF="#first">第１章</A>
第２章
第３章
第４章
第５章
第６章
第７章
第８章




<A NAME="first">第１章</A>
まずはじめに…

　とHTMLを書いておけば、目次の「第１章」というところをクリックすれば、下の方にある「第１章」の頭のところに飛んでくれるわけです。
　これは、異なったファイル中のラベルに対しても有効で
<A HREF="リンク先ファイル名#ラベル名">・・・・</A>
としておけば、「・・・・」をクリックすると、指定ファイルのラベルのところまでいっきに飛びます。

別サイトへのリンク
<A HREF="http://リンク先URL/">・・・・</A>

　リンクは、同じWebサイトばかりでなく、異なるWebサイト内のファイルに張ることも出来ます。よく見る、「リンク集」などがこれを使っています。「・・・・」をクリックすると指定URLにジャンプします。リンク先のサイト名とファイルの名前を正確に書く必要があります。


ファイル位置の記述法（ファイルパス）
これについては、絵（変更の必要あり）などもあるので、
www.pharm.kumamoto-u.ac.jp/joho1/6-29/link.htmlを見て下さい。


　リンクを張るときは、リンク先のファイルを指定しないといけませんが、それはただファイル名を指定するだけではいけません。ファイルの位置も指定しないといけません。
　コンピュータの中でファイルは、だいたいの場合何らかのフォルダーに入っています。このフォルダーもまた、フォルダーに入っていることもあり、あるファイルからみたリンク先ファイルというのは、同一フォルダー内にあることもあれば、違うフォルダー内にあるときもあります。
違うフォルダーにあるとき、「階層が違う」といいます。この「階層」というものをきちんと表記することによって、ファイルの位置が指定できます。
　ファイル位置の指定法には大きく分けて２つあります。ひとつは絶対パス法、もう一つは相対パス法です。
絶対パスとは、コンピュータ内での絶対的な位置関係を表わすもので、相対パスというのは、自分からの相対的位置関係を表わすものです。実例で、示してみましょう。



これは、「99p2098」というフォルダーの中に「report」というフォルダーがあり、その中に「report.html」というファイルが存在することを示しています。この、「99p2098」というフォルダがコンピュータの「デスクトップ」にあるとしたら、「report.html」の位置を絶対パス法で記述すると

デスクトップ/99p2098/report/report.html


となります。この表記法は、単純で分かりやすいのですが、HTMLにおいては、不必要に多くのフォルダー名を列挙しなくてはいけなくなるときがあるので、あまり使いません。
　相対パス法で考えてみると、「index.html」から見た「report.html」は

report/report.html


逆に、「report.html」からみた「index.html」は

../index.html


と書き表わします。階層の変化を「/」で表わし、ひとつ外のフォルダを表わすときに「../」と書きます。このように、相対的な位置関係で指示すれば、必要最小限の指示で、ファイルの位置を指定することが出来ます。
　ファイル間でリンクを張るときは、この相対パス法でファイルの位置を指定するようにして下さい。 -------------------- HTML8.html ここから --------------------= ・画像について

<IMG SRC="イメージファイル名">

と、画像イメージファイルを指定すると、画像が表示されます。この、ファイル名の指定は、リンク先の指定のときと同様に、ファイルの位置を相対パス（詳しくはこちらを）で指定する必要があります。
　また、画像ファイルとして表示出来るのは、おもに　JPEG（JPG）とGIFと呼ばれるファイル形式のものです。
　これらは、コンピュータの機種（OS）を問わない、画像の汎用フォーマットです。テキストファイルのように、さまざまな種類のコンピュータ（OS）やソフトで開くことが出来ます。これら汎用フォーマットの他に、Windowsパソコンで用いられるBMP形式やMacOSで用いられるPICT形式などがあります。これらは、表示すればそれほど違いはありませんが、そのファイルサイズがだいぶん違います。
このあたりは、画像もありますので、
http://www.pharm.kumamoto-u.ac.jp/joho1/6-29/image.html
を参照して下さい。




たとえば、これは***********の写真ですが、これを各形式に変換しますと、ファイルサイズが変わります。



JPEG形式が20KBと、断トツにファイルが小さいことがわかります。Webで用いる画像ファイルは、サイズが小さいほうが表示がスムーズですから、最近ではJPEGを用いるのが普通です。ただし、線画などの場合、GIF形式の方がきれいに表示される場合もあります。 -------------------- HTML9.html ここから --------------------= ・リスト

　文字列を並べるときは、リストを作ると見やすいです。

マーク付きリスト
<UL><LI> 項目</UL><
<UL>
<LI> 項目１
<LI> 項目２
</UL>

とHTMLを書くと、以下の様に表示されます。


これは、「いれこ」にすることが出来、

<UL>
<LI> 大項目１
　　<UL>
　　<LI> 中項目１
　　　<UL>
　　　<LI> 小項目
　　　</UL>
　　<LI> 中項目２
　　</UL>
<LI> 大項目２
<LI> 大項目３
　　<UL>
　　<LI> 中項目１
　　<LI> 中項目２
　　</UL>
</UL>
　とHTMLを書けば　
  • 大項目１ 　　
      　　
    • 中項目１ 　　　
        　　　
      • 小項目 　　　
      　　
    • 中項目２ 　　
  • 大項目２
  • 大項目３ 　　
      　　
    • 中項目１ 　　
    • 中項目２ 　　
    		• と階層的に表示することが出来ます。


    番号付きりスト
    <OL><LI>項目</OL>
    これは、マークの代わりに番号がつくものです。
    <OL>
    　<LI>     項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    </OL>
    とHTMLを書けば
    自動的に番号がついて、以下のように表示されます。
    1. 項目
    2. 項目
    3. 項目
    4. 項目
    5. 項目


    そして、この番号はスタート番号を変えたり、番号の種類を変えたりできます。
    <OL start=10>
    　<LI>     項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    </OL>

    と書けば

    1. 項目
    2. 項目
    3. 項目
    4. 項目
    5. 項目

    と表示されますし

    <OL type=a>
    　<LI>     項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    　<LI> 項目
    </OL>
    と書けば

    1. 項目
    2. 項目
    3. 項目
    4. 項目
    5. 項目


    と表示されます

    定義型リスト
    <DL><DT> 項目<DD> 項目の意味</DL>
    <DL>
    　<DT> 項目
    　<DD> 項目の意味
    　<DT> 項目
    　<DD> 項目の意味
    </DL>
    とHTMLを書けば
    項目
    項目の意味
    項目
    項目の意味


    と表示されます。 -------------------- HTML10.html ここから --------------------= ・表
    ＜TABLE BORDER="ピクセル数"＞・・・・＜/TABLE＞
    　この二つのタグで、表を定義します。表中の各セル（項目）は＜TD＞・・＜/TD＞で指定します。さらに、これを必要なセルの数だけ並べて、＜TR＞・・・＜/TR＞で囲むと、横一列となります。この列を必要数並べると、複数行の表となります。
    BORDERオプションは、枠の太さをピクセル数で指定するものです。デフォルトは１で、数値を大きくすれば太い枠の表となります。また、0と指定すると、枠が無くなり、各セルの項目が表形式で並ぶだけです。

    例えば
    <TABLE BORDER="2">
    <TR><TD>セル１</TD><TD>セル２</TD><TD>セル３</TD></TR>
    <TR><TD>セル４</TD><TD>セル５</TD><TD>セル６</TD></TR>
    <TR><TD>セル７</TD><TD>セル８</TD><TD>セル９</TD></TR>
    </TABLE>
    と、ソースを書けば、
    セル１セル２セル３
    セル４セル５セル６
    セル７セル８セル９

    と表示されます

    <TABLE ALIGN="位置の指定">・・・・・</TABLE>
    　表全体の表示位置を指定することができます。位置の指定として「left」とすれば左寄せ、「right」とすれば右寄せ、となります。
    例えば <TABLE BORDER="2" ALIGN="left">
    <TR><TD>セル１</TD><TD>セル２</TD><TD>セル３</TD></TR>
    <TR><TD>セル４</TD><TD>セル５</TD><TD>セル６</TD></TR>
    <TR><TD>セル７</TD><TD>セル８</TD><TD>セル９</TD></TR>
    </TABLE>
    <TABLE BORDER="2" ALIGN="right">
    <TR><TD>セル右１</TD><TD>セル右２</TD><TD>セル右３</TD></TR>
    <TR><TD>セル右４</TD><TD>セル右５</TD><TD>セル右６</TD></TR>
    <TR><TD>セル右７</TD><TD>セル右８</TD><TD>セル右９</TD></TR>
    </TABLE>
    と、ソースを書けば、
    セル１セル２セル３
    セル４セル５セル６
    セル７セル８セル９
    セル右１セル右２セル右３
    セル右４セル右５セル右６
    セル右７セル右８セル右９





    と表示されます

    <TD COLSPAN="列の数">・・</TD>
    複数の列にまたがるセルを指定します。
    例えば <TABLE BORDER="2">
    <TR><TD COLSPAN="3">セル長１</TD></TR>
    <TR><TD>セル短２</TD><TD>セル短３</TD><TD>セル短４</TD></TR>
    </TABLE>
    と、ソースを書けば
    セル長１
    セル短２セル短３セル短４

    と表示されます。

    <TD ROWSPAN="行の数">・・</TD>
    複数の行にまたがるセルを指定します。
    <TABLE BORDER="2">
    <TR><TD ROWSPAN="2">セル縦１</TD><TD>セル短２</TD><TD>セル短３</TD></TR>
    <TR><TD>セル短４</TD><TD>セル短５</TD></TR>
    </TABLE>
    と、ソースを書けば
    セル縦１セル短２セル短３
    セル短４セル短５

    と表示されます。

    <TD ALIGN="左右の位置" VALIGN=''上下の位置">・・</TD>
    セル内のテキストの表示位置を指定します。
    左右の位置は、「left, center, right 」で、左、中央、右、を指定し、
    上下の位置は、「top, middle, bottom」で、上、中央、下、を指定します。

    <TD BGCOLOR="色コード">・・</TD>
    各セルの背景色の指定をします。前述の色コードで指定します。 -------------------- HTML11.html ここから --------------------= ・フォーム
    　webページには、情報の入力欄がある場合があります。これは、入力した文字が、何らかのソフトへ送られて処理させるようにしてあるのですが、入力欄そのものは、HTMLで作ることが可能です。このような、入力欄を「フォーム」といい、＜FORM＞・・・・・＜/FORM＞で、指定されます。

    ・文字入力欄
    ＜FORM＞
    名前：＜INPUT TYPE="text" SIZE="30"＞＜BR＞
    住所：＜INPUT TYPE="text" SIZE="40"＞＜BR＞
    ＜/FORM＞
    とソースを書くと、
    名前：
    住所：

    と表示されます。
    　ここで、「TYPE="text"」は、入力される文字が通常のテキストであることを意味します。「TYPE="password"」とすると、入力画面上では、*や●しか表示されません。 また、「SIZE=20」は、入力欄の長さを半角文字単位で指定します。デフォルトでは、20（全角文字で10文字）です。
    なお、
    名前：＜INPUT TYPE="text" SIZE="30" VALUE="熊大　太郎"＞
    とソースを書くと
    名前：
    と、入力欄に「VALUE=""」で指定した文字が最初から表示されます。これは、入力者が変更することが出来ます。

    ・複数行入力
    複数行にわたるテキスト入力欄を作るときは
    ＜FORM＞
    ＜TEXTAREA NAME="****"＞＜BR＞
    複数行記入欄
    ２行目
    ３行目
    ＜/TEXTAREA＞
    ＜/FORM＞
    とソースを書けば

    と表示されます。ここで、***は、データとしての名前で、必ず指定することが必要です。
    また、入力欄の横幅・行数（表示される欄の大きさ）も指定できます。
    ＜FORM＞
    ＜TEXTAREA COLS="40" ROWS="5"＞
    ＜/TEXTAREA＞
    ＜/FORM＞
    とソースを書けば、

    と表示されます。「COLS=""」が横幅で、半角単位での指定です。「ROWS=""」は行単位での指定です。

    ・ラジオボタン
    ラジオボタンとは以下のようなものです。
    はい、いいえ

    ソースは
    ＜FORM＞
    ＜INPUT TYPE="radio" NAME="****" VALUE="はい"＞はい、＜INPUT TYPE="radio" NAME="****" VALUE="いいえ"＞いいえ
    ＜/FORM＞
    で、ここで、「TYPE="radio"」がラジオボタンを指定しています。ボタンをクリックすると、「VALUE=""」に書かれているデータが送られます。なお、NAMEオプションで指定されているデータ名が同じ場合は、どれか一つしかクリック出来ません（別のものをクリックすると、今までクリックしていたものは消えます）。

    ・チェックボックス
    チェックボックスは、ラジオボタンとは異なり、複数の項目をいくつでも選択できます。
    ＜FORM＞
    好きな果物は？＜BR＞
    ＜INPUT TYPE="checkbox" NAME="****" VALUE="りんご"＞りんご、＜INPUT TYPE="checkbox" NAME="****" VALUE="ぶどう"＞ぶどう、＜INPUT TYPE="checkbox" NAME="****" VALUE="みかん"＞みかん
    ＜/FORM＞
    と、「TYPE="checkbox"」と指定すれば
    好きな果物は？
    りんご、ぶどう、みかん

    と表示されます。

    ・プルダウンメニュー
    文字入力欄に、選択項目をプルダウンメニューとして表示することができます。
    ＜FORM＞
    出身県は？＜BR＞
    ＜SELECT NAME="****"＞
    ＜OPTION VALUE="福岡"＞福岡
    ＜OPTION VALUE="長崎"＞長崎
    ＜OPTION VALUE="佐賀"＞佐賀
    ＜OPTION VALUE="熊本" SELECTED＞熊本
    ＜OPTION VALUE="大分"＞大分
    ＜OPTION VALUE="鹿児島"＞鹿児島
    ＜OPTION VALUE="宮崎"＞宮崎
    ＜/SELECT＞
    ＜/FORM＞
    の様に＜SELECT＞・・・＜/SELECT＞で指定します。＜OPTION＞で項目名を指定し、SELECTEDオプションにより、最初に表示される項目が指定できます。
    出身県は？
    -------------------- HTML12.html ここから --------------------= HTML 解説記事へのリンク集・参考図書

    HTMLに関する情報はインターネット上にたくさんあります。
    入門的なものを集めたリンク集として

    YAHOOのリンク集
    があります。

    また、参考図書も非常にたくさんあります。 などのサイトで「HTML」をキーワードで検索してみて下さい。様々な切り口の書籍がありますので、気に入ったものをまず手に取ってみることをお勧めします。
    　なお、少し古いですが有名な本としては
    HTML入門
    ローラ・リメイ著
    武舎広幸、久野禎子、久野靖　訳
    プレンティスホール

    続・HTML入門
    ローラ・リメイ著
    武舎広幸、久野禎子、久野靖　訳
    プレンティスホール

    があり、ハンディなものとしては
    ホームページ作成のためのHTML辞典
    村本周示　編
    日経文庫

    があります。 # -------------------- HTML12.html ここまで -------------------