制作者の活動(PR)。

堀北真希ちゃんにうさみみを着けた擬獣化キャラクタ。次
主な作品

アイドルをモデルにした創作キャラクタを用いたイラストの一例とそれを組み込んだアニメーション動画

<frame>要素(フレーム)。

フレームを指定する<frame>要素についての解説です。

<frame>要素(フレーム)・目次。

<frame>要素とは。

<frame>要素とは、フレームを指定する要素です。

具体的には当該フレームに名前を付けて指定した文書を表示させます。

<frame>要素を利用出来るHTML文書型。

<frame>要素HTML 4.01及びXHTML 1.0フレームセット文書型でのみ利用出来ます。

<frame>要素が含まれるXHTML モジュール。

<frame>要素はフレームモジュールに属します。

<frame>要素の実装上の注意。

リンクスや携帯電話などフレームに対応していないユーザエージェントもある事は忘れないで下さい。

<frame>要素の扱い。

<frame>要素<frameset>要素直下でのみ記述出来ます。

<frame>要素は必要な情報を属性で指定するため、内容を持たない空要素となります。

<frame>要素の属性。

<frame>要素には以下の属性が定義されております。

コア属性
name属性

当該フレームの名前を指定します。ここで指定された名前はtarget属性での表示先に使えます。

src属性

始めに表示する文書のURIを指定します。

longdesc属性
フレームの内容に関する説明文へのURIを指定します。非視覚系ユーザエージェントなどフレーム全体を見渡すのが困難な環境では有用な情報となります。
frameborder属性

当該フレームの枠を表示させるかどうかを指定します。

値は 0(枠非表示)か 1(枠表示)のいずれかとなります。

marginwidth属性
フレーム内の左右の余白をピクセル単位で指定します。
marginheight
フレーム内の上下の余白をピクセル単位で指定します。
noresize属性値
フレームの枠を移動禁止にします。尚、XHTML 1.0ではnoresize="noresize"属性とします。
scrolling属性

フレーム内のスクロールの可否を指定します。

値は

auto
必要な場合にスクロール可能(デフォルト)
yes
何時でもスクロール可能
no
スクロールは絶対不可

の三つがあります。

この他にも枠の幅や色を指定する非公認属性もありますが、割愛させて頂きます。

<frame>要素に関する注意事項。

<frame>要素のsrc属性で直接画像を指定しないで下さい。

<frame>要素のsrc属性で画像を直接開くと、画像が見られない或いは画像を非表示にしている場合に何の画像なのか分からなくなってしまいます。

どうしても画像をフレームに表示させたいのなら、せめて画像を<img>要素で埋め込み、代替コンテンツを持ったHTML文書を作って、それをフレームに組み込んで下さい。

<frame>要素のsrc属性で指定すべき文書。

<frame>要素のsrc属性ではユーザエージェントが扱う事の出来る文書であれば文法上は何でも良い事にはなっておりますが、フレームに組み込まれる文書ではトランジッショナル文書型が最適でしょう。

フレームの分け方にも充分注意して下さい。

フレームの幅や高さの決め方が悪いと、見るに堪えないサイトになってしまいます。

ウィンドウを切り刻む訳ですから、環境に依っては文書がフレームに入り切らなくなって、余計なスクロールが発生してしまうでしょう。

しかも、scrolling属性でスクロールを出来なくしてしまうと、環境に依っては読めなくなってしまう恐れもあります。

ウィンドウサイズを適宜小さくするなどして見難くならない事を確かめて下さい。

<frame>要素の記述例。

<?xml version="1.0" encoding="shift_jis"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<title>HTML入門</title></head>
<frameset rows="80,*">
    <frame id="title" name="title" src="TitleBar.html" />
    <frameset cols="*,7*">
        <frame id="menu" name="menu" src="Menu.html" />
        <frame id="main" name="main" src="Home.html" />
        </frameset>
    <noframes>
        <body>
            <h1>HTML入門</h1>
            <h2>目次</h2>
            <dl>
                <dt><a rel="next" rev="start" href="introduction.html">はじめに</a></dt>
                <dd>平成18年 5月31日更新</dd><dt><a rel="bookmark" href="link.html">リンク</a> </dt>
                <dd>平成18年 5月20日解説</dd>
                </dl>
            </body>
        </noframes>
    </frameset>
</html>

この場合、

  1. 一番上に高さ80ピクセルズの「title」と言うフレームが開かれ「TitleBar.html」が表示されます。
  2. その下には

    1. 左側には幅 1の「menu」と言うフレームが開かれ「Menu.html」が
    2. 右側には幅 7の「main」と言うフレームが開かれ「Home.html」が

    それぞれ表示されます。

  3. また、フレーム非対応環境向けに<noframes>要素でノンフレーム版のメニューを用意しております。

関連項目。

しらぎくのウェブサイト作成入門サイトマップ

ページ外へのご案内。

marguerite.site@gmail.com