12.がめんを わける 

……………………………………………………………………
がめんを いくつかに わけて、
それぞれに ちがうファイルを うつさせてみよう。
……………………………………………………………………

       がめんを ふたつに わけてみよう       

 こんなふうに、がめんを ふたつに わけてみましょう。(「みてみよう」ボタンをおしてね)

みてみよう!

まず、がめんに うつさせる ファイルを ふたつ よういします。
たとえば、「7.リンクさせてみよう」で つくった、「rink1.html」と、
「rink2.html」
を、そのままつかっても いいです。

それにもうひとつ、がめんを わけるための ファイルを じゅんびします。

1.「さいしょのさいしょ」でつくった「file1.html」に、
したの ふともじでかいてある きごう(タグ)をかいてみてね。
(はいいろのところは「file1.html」でつくったものなので、かかなくていいです)

<HTML>
    <HEAD>
      <TITLE> はじめてのホームページ </TITLE>
    </HEAD>

    <FRAMESET COLS="30%,*">
      <FRAME SRC="rink1.html" NAME="frame1">
      <FRAME SRC="rink2.html" NAME="frame2">
    </FRAMESET>
</HTML>

  ●・ せつめい ・●
  • <FRAMESET COLS="〜,〜">
    「がめんを たてに わけなさい」という、めいれいです。
    ひとつめのに ひだりの がめん(ここでは「フレーム」といいます)の おおきさ、
    ふたつめのには、みぎの フレームのおおきさを かきます。
    ふたつめの に「*」をかくと、「ひだりの フレームの ほかぜんぶ」の いみになります。

  • <FRAME SRC="〜">
    うえの、<FRAMESET COLS="〜,〜">でわけた、それぞれのフレームに、
    ファイルを うつさせる めいれいです。
    <FRAMESET COLS="〜,〜">の めいれいは、かならず フレームを わけたかずだけ よういします。
    ひとつめのに ひだりの フレームの ファイルの なまえをかき、
    ふたつめのに、みぎの フレームの ファイルの なまえを かきます。

  • NAME="〜"
    わけた フレームの ひとつひとつに、なまえをつける めいれいです。
    このなまえは、リンクしたページを どのフレームに うつさせるかを めいれい するときに つかいます。

……………………………………………………………………
がめんを よこに わけることも できます
……………………………………………………………………

<FRAMESET COLS="30%,*">COLSのかわりに、 ROWSと かいてみると…。
  (<FRAMESET ROWS="30%,*">)

みてみよう!

がめんが よこに わけられました。

……………………………………………………………………
がめんを 3つや4つに わけることも できます
……………………………………………………………………

<FRAMESET COLS="30%,*">30%,*のかわりに、 30%,40%,20%,*と かいて、
<FRAME SRC="〜">を4つ、フレームにうつす ファイルを 4つ じゅんびすると…。
  (<FRAMESET COLS="30%,40%,10%,*">
    <FRAME SRC="rink1.html" NAME="frame1">
    <FRAME SRC="rink2.html" NAME="frame2">
    <FRAME SRC="rink3.html" NAME="frame3">
    <FRAME SRC="rink4.html" NAME="frame4">
   </FRAMESET>)

みてみよう!

がめんが 4つに わけられました。

……………………………………………………………………
わけられた がめんを さらに こまかく わけることも できます
……………………………………………………………………

  <FRAMESET COLS="30%,*">
    <FRAME SRC="rink1.html" NAME="frame1">
   <FRAMESET ROWS="10%,*"> ←みぎの フレームを さらに よこに わける めいれいです。
    <FRAME SRC="rink2.html" NAME="frame2">
    <FRAME SRC="rink3.html" NAME="frame3">
   </FRAMESET>
  </FRAMESET>

みてみよう!

がめんが たてと よこに 3つに わけられました。


       フレームにリンクページをうつさせよう       

……………………………………………………………………
 フレームに うつさせるファイルに、リンクがついていると、
そのぺーじと おなじフレームに ジャンプした ページが うつしだされます。
……………………………………………………………………

ひだりの フレームに、「7.リンクさせてみよう」で つくった、「rink.html」を うつすように すると…。
(「みてみよう」ボタンをおしてね)
  <FRAMESET COLS="30%,*">
   <FRAME SRC="rink.html" NAME="frame1">
   <FRAME SRC="rink2.html" NAME="frame2">
  </FRAMESET>

みてみよう!

「ほかの ページへ ジャンプ」の もじを クリックすると、ひだりの フレームが ジャンプしました。

……………………………………………………………………
リンクページを、さいしょのファイルと ちがうフレームに 
うつさせることも できます。
(「みてみよう」ボタンをおしてね)
……………………………………………………………………

みてみよう!

これは、リンクするほうの ファイル(ひだりがわに うつさせた ファイル)に
ひみつが あります。

「7.リンクさせてみよう」で つくった、「rink.html」
したの ふともじでかいてある きごう(タグ)をかいてみてね。
(はいいろのところは「rink.html」でつくったものなので、かかなくていいです)

<HTML>
    <HEAD>
      <TITLE> はじめてのホームページ </TITLE>
    </HEAD>
    <BODY>
      こんにちは。
      <A HREF="rink1.html"
      TARGET="frame2">ほかのページにジャンプ!</A>
              
    </BODY>
</HTML>

このファイルの名まえを、「rinkrink.html」にして、ほぞんしよう。

あとは、フレームの ひだりがわに、「rinkrink.html」をうつさせるだけ。

  ●・ せつめい ・●
  • TARGET="〜"
    という なまえの フレームに、
    リンクした ぺーじを うつさせなさい、というめいれいです。


もうすこし おにいさん、おねえさんのためのまとめです。
 タグのいろいろ(12)
  フレーム タグ

<FRAMESET COLS="〜,〜">→フレームの指定(ブラウザ縦割り分割)
 "〜,〜"部分は、左のフレームから順に
 フレーム幅(ピクセル)または分割比率の指定。
 また、3分割以上も可能。
<FRAMESET ROWS="〜,〜">→フレームの指定(ブラウザ横割り分割)
 "〜,〜"部分は、上のフレームから順に
 フレーム幅(ピクセル)または分割比率の指定。
 また、3分割以上も可能。
NAME="〜"→フレームに名前をつける
<FRAMESET BORDER="〜">→フレーム境界線の幅指定
<FRAMESET BORDERCOLOR="〜">→フレーム境界線の色
<FRAMESET FRAMEBORDER"〜">
(内は、yesかno)
→フレーム境界線の表示または非表示
<A HREF="URL" TARGET="〜">
(〜は、フレーム名)
→リンクページを表示させるフレームの指定
    TARGET="_blank"
→新しくウィンドウを作り、そこにファイルを表示する
    TARGET="_self"
→リンク元のあるフレームにファイルを表示する
    TARGET="_parent"
→リンク元の1階層上のフレームに表示
<FRAMESET>タグを多用しているときに使用する。
    TARGET="_top"
→フレームに関係なく、ウィンドウ全体にファイルを表示
<NOFRAME>〜<NOFRAME>→フレームが見られないブラウザのための指定

まえへ一つもどる