サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
体力トレーニング
html.eweb-design.com
<IFRAME>タグについて HTML文書の中にフレームを埋め込む方法として、<IFRAME>タグがあります。このタグで作成されたフレームはインラインフレームと呼びます。 インラインフレームは大変便利で使いやすいフレームですが、NN4.x以下は対応していません。 <IFRAME>~</IFRAME>タグ内には、対応していないブラウザで表示する内容を記述します。
サンプルと機能 <A>タグを用いて1つの画像にリンクを設定する場合、リンク先は当然1つになります。 しかし、HTMLのイメージマップと呼ばれる方法を用いれば、 1つの画像の任意の部分から複数の画像を設定することができます。 オレンジ色の施設にカーソルを合わせてみて下さい。 (リンク先はありません) リンクは四角形だけでなく、円形や多角形に貼ることもできます。 サンプル・ソース 緑の文字が変更箇所で、赤い文字が対応するソースです。 "/* */"内はコメントです。削除しても影響ありません。 必要な箇所をコピー&貼り付けして編集してください。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <IMG src="img/i0501a.gif" width="400" height="250" border="1" usemap="#mapID
<TBODY>タグについて 表を構成する要素はヘッダ<THEAD>、本体<TBODY>、フッタ<TFOOT>の3つに分けられます。 <TBODY>タグは本体部分をグループ化します。 ブラウザに認識させるため、<THEAD>→<TFOOT>→<TBODY>の順番で記述します。
<H2>中央揃え</H2> <P>以下より中央揃えにします。</P> <CENTER> <P>中央揃えになっています</P> <IMG src="img1.jpg" width="160" height="120" border="0"> <P>画像を中央揃えになります</P> <TABLE border="1" width="90%"> <TR> <TD>テーブルも</TD> <TD>中央揃えになります</TD> </TR> </TABLE> </CENTER> <P>中央揃えを解除します</P>
<TITLE>タグについて ページのタイトルを設定します。設定したタイトルは、ブラウザのタイトルバーやお気に入りの見出し、検索結果などに使われますので、必ず設定するようにしましょう。 <TITLE>タグを複数指定してはいけません。 <BASE>タグについて リンクの基準となるURLや、リンクを表示するウィンドウまたはフレームを設定します。 <BASE>タグを複数指定してはいけません。 <BASE>タグには終了タグはいりません。
<TABLE>タグについて 表を作成して、文章などを整理することができます。<TABLE>タグはレイアウトを行う際に大変便利です。
<H2>セレクトメニュー、リストボックス</H2> <P>メニューの作成を行います。</P> <FORM> <SELECT> <OPTION value="1">項目1</OPTION> <OPTION value="2" selected>項目2</OPTION> <OPTION value="3">項目3</OPTION> <OPTION value="4">項目4</OPTION> <OPTION value="5">項目5</OPTION> </SELECT> <P>リストボックスの作成を行います。複数選択可能です。</P> <SELECT size="6" multiple> <OPTION value="1">項目1</OPTION> <OPTION value="2" selected>項目2</OPTION> <OPTION value="3">
<H2>ラベル</H2> <P>チェックボックス・ラジオボタンでラベルと部品を関連付けます。</P> <FORM> <INPUT type="checkbox" id="i1"><LABEL for="i1">チェック可能です。</LABEL><BR> <INPUT type="checkbox" id="i2"><LABEL for="i2">チェック可能です。</LABEL><BR> <INPUT type="checkbox" id="i3"><LABEL for="i3">チェック可能です。</LABEL><BR><BR> <INPUT type="radio" name="rdo" id="r1"><LABEL for="r1">ラジオボタン1</LABEL> <INPUT type="radio" name="rdo" id="r2"><LABEL for="r2
<MAP>タグについて 1つの画像を複数の領域に分けて、それぞれの領域にリンクを設定します。これはクリッカブルマップやイメージマップと呼ばれます。 <MAP>タグでは、イメージマップでどのような領域を区切るか定義します。 イメージマップで使用する画像を指定している<IMG>タグにはusemap属性が必要です。
<INPUT type="text"> <INPUT type="password"> <INPUT type="radio"> <INPUT type="checkbox"> <INPUT type="submit"> <INPUT type="reset"> <INPUT type="button"> <INPUT type="image"> <INPUT type="file"> <INPUT type="hidden">
<TD>タグについて 表の行をセル単位に区切るには、<TD>タグを用います。<TR>タグで設定した値よりも<TD>で設定した値の方が優先されます。
サンプル・ソース 緑の文字が変更箇所で、赤い文字が対応するソースです。 "/* */"内はコメントです。削除しても影響ありません。 必要な箇所をコピー&貼り付けして編集してください。 → Sample 1:ボタンに画像を貼る <FORM> <TEXTAREA rows="4" cols="40"></TEXTAREA> <BUTTON type="submit" style="background-color: #ffffcc;"> <IMG src="url.gif" width="60" height="15"> </BUTTON> <BUTTON type="reset" style="background-color: #ccffff;"> <IMG src="url.gif" width="60" height="15"></BUTTON> </FORM>
<OBJECT classid="...(省略)" codebase="...(省略)" width="320" height="240"> <PARAM name="MOVIE" value="img/sample.swf"> <PARAM name="PLAY" value="true"> <PARAM name="LOOP" value="true"> <PARAM name="QUALITY" value="high"> </OBJECT>
文字の移動 <MARQUEE> <MAQUEE>タグについて テキストを自動的にスクロールさせるタグです。上下左右や、繰り返し、スピードなどを設定することができます。 赤い文字は初期値(何も設定しなかった場合の値)
<BLOCKQUOTE>タグについて 段落全体など、ブロック要素の引用を行う場合に用いられます。ほとんどのブラウザで字下げが行われます。 短い文章の引用には<Q>タグを用います。 <Q>タグについて 改行などを伴わない短い文章の引用を行う場合に用いられます。IE以外のブラウザでは「"」が前後に付けられます。 長いい文章の引用には<BLOCKQUOTE>タグを用います。 <CITE>タグについて 引用もとの書籍、著者名などを示します。多くの場合、<BLOCKQUOTE>タグや<Q>タグと同時使われます。 サンプル 以下、引用を開始します。 サンプルサンプルサンプルサンプル サンプルサンプルサンプルサンプル サンプルサンプルサンプルサンプル サンプルサンプルサンプルサンプル 引用を終了します。 一部、引用すると、「ここが引用されています」となります。 参考文献:eWeb-HTM
定義リスト <DL> <DT> <DD> <DL>タグについて 定義型のリストを作成します。<DL>タグでリスト本体を定義し、<DT>タグでリストの項目を定義し、<DD>タグにそのリストの内容を記述します。 <DT>タグについて リストの項目を定義します。 終了タグは省略することもできますが、表示がおかしくなるブラウザもあります。 <DD>タグについて リストの内容を記述します。 終了タグは省略することもできますが、表示がおかしくなるブラウザもあります。 サンプル リスト 項目をここに書きます ここに項目の説明などを書きます 項目2 サンプルサンプルサンプル 項目3 サンプルサンプルサンプルサンプル 項目4 サンプルサンプルサンプルサンプルサンプル
<RUBY>タグについて 文字にルビ(フリガナ)をふることができるタグです。ルビを振る対象となる文字は<RB>タグで、ルビの内容は<RT>タグでそれぞれ指定します。 <RB>タグについて <RUBY>〜<RUBY>内で有効なタグで、ルビを振る対象となる文字を指定するために用います。<RB>〜</RB>内が指定されますが、終了タグを省略すると、<RT>などのタグまでが有効となります。 <RT>タグについて <RUBY>〜<RUBY>内で有効なタグで、ルビの内容を指定するために用います。 <RT>〜</RT>内が指定されますが、終了タグを省略すると、<RUBY>などのタグまでが有効となります。 <RP>タグについて <RUBY>〜<RUBY>内で有効なタグで、ブラウザが<RUBY>タグに対応していない場合に、その表示をおかしくさせないために用います。 <RP>〜<RP>内の内容は、<
<EMBED>タグについて 動画や音声をページに埋め込みます。 埋め込み可能な形式は、MPEG(.mpg)、QuickTime(.mov)、Wave(.wav)など数多くあります。 ただし、再生するには、対応したプラグインがインストールされている必要があります。
ページを切り替える時の特殊効果 サンプルと機能 ページを切り替える時の特殊効果を演出します。 トランジション(Transition)効果と呼ばれ、Internet Explorerのみで有効になります。 → Sample 0 / 1 / 2 / 3 / 4 / 5 / 6 / 7 / 8 / 9 / 10 / 11 / 12 / 13 / 14 / 15 / 16 / 17 / 18 / 19 / 20 / 21 / 22 / 23 / サンプル・ソース 緑の文字が変更箇所で、赤い文字が対応するソースです。 "/* */"内はコメントです。削除しても影響ありません。 必要な箇所をコピー&貼り付けして編集してください。 <HTML> <HEAD> <!-- 秒数と、トランジション番号の設定 --> <META http-equiv="page-enter
フォントの使い方 フォントは、<FONT>タグのface属性を使って以下のように指定します。 <FONT face="Arial">This Font is Arial</FONT> 指定したフォントが見つからなかった場合、有効になりませんので、対策として複数のフォントを指定することが可能です。 その場合、左から優先的に表示されます。 <FONT face="Arial","Arial Black","MS P明朝">複数のフォント</FONT> 以下のようにスタイルシートでも指定することが可能です。 <SPAN STYLE="font-family:'Arial','Arial Black'">スタイルシート</SPAN>
HTMLタグを機能別に紹介しています。 このリファレンスはHTML4.01の規格に基づいて作成されており、IE独自のタグなども紹介しています。 HTML Tips、アルファベット順のタグIndexなども用意していますので併せてご覧になって下さい。
<FIELDSET>タグについて テキスト領域やチェックボックスなどのフォームの構成部品をグループ化します。入力や選択する項目が多い場合に用いられます。 <FIELDSET>〜</FIELDSET>内には<LEGEND>タグを含んでいる必要があります。 <LEGEND>タグについて <FIELDSET>タグで定義されたグループにタイトルや説明などをつけます。
特殊文字の使い方 特殊文字はキーワードまたは番号で指定します。 例えば「?」という特殊文字を表示したい場合は、 ソースに「♠」または「♠」と記述します。 特殊文字はOSやブラウザに依存します。 表示がない、「□」という文字になっているなどの場合は、 その特殊文字にOSやブラウザが対応していません。 ISO 8859-1
<TEXTAREA>タグについて 複数行のテキスト入力領域を作成します。<TEXTAREA>〜</TEXTAREA>内に文章を記入しておくと、あらかじめ入力された形で表示されます。 readonly属性を使って、プログラムのソースなどを表示するのにもよく使われます。
このページを最初にブックマークしてみませんか?
『HTMLタグリファレンス-Tips - eWeb』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く