• ベストアンサー

テーブル?フレーム?

geocitiesを利用しています。 ホームページビルダーを利用して、今までページを作っていました。 質問です。 よく、素材サイトなどのページで、 フレームで言うと縦3列に並んでいて、中央だけが表示されているような状態のサイトや、 (両端のフレームにあたるところはつねに空白) 画面中央に縦の長四角のスペースがあり、 そこだけが画面として変化するサイトがあります。 あのように、全面が表示されないページを作りたいのですが、 テーブルやフレームなどをあまり利用した事がありません。 どのような処理、タグを使うと、あのようになるのでしょうか。(説明しにくいので、補足はいたします) また、トップページが全画面でも、 子画面が開き、ブラウザボタンなどがつかえないような、 大きさが固定されたページがでるサイトもあります。 前者よりこちらのほうが簡単であれば、こういった形式でもいいな、と思っています。 とにかく初心者で、ビルダーで作ってきたので、 説明が下手なのですが、 わからない部分は補足させていただきますので(本日中には必ずレスが返せる体制です) よろしくお願いいたします。 FTPなどでアップするのではなく、ブラウザ上からアップしているので、フレームを利用する際にも、いちいちフレームのページを1・2・3、などとアップしています。 (もしかしたら方法を知らないだけかもしれません) 「こんな感じで検索すればわかる」というご意見でもいただけると嬉しいです。 よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#199778
noname#199778
回答No.3

再び失礼します。 フレームの件についてですが、前掲の例にあるframeタグのsrcは、そのフレーム内に一番初めに読み出すファイルを指定します。 ですので、フレームを切った時にindex.htmlをはじめから表示させたいのであれば、前の例の<frame src="***.html">の***.htmlを、index.htmlにすれば良いと思います。 ちなみに、フレーム名についてですが、frame要素にはname属性が設定でき、複数のフレーム間で別のフレーム内にリンク先のファイルを表示させる場合(メニューとメインのフレームの2分割にして、メニューからメインのフレームにファイルを呼び出すケースなど)に利用されます。 このときに、frame要素に設定したname属性のことを、一般にはフレーム名といいます。 こちらのフレーム名については、一定の制約の下(名前は半角英数字、など)で任意に決めることができます。 なお、そのサイトが開かれたその時にフレームを切って、トップページをフレームの中に表示させたいと言う場合は、フレームを切るHTMLファイル自体(前掲のフレームを切るソースを記載したファイル)を「index.html」と言う名前にしておく必要があると思います。 ジオシティーズの設定では、サイトを開かれた時に一番初めに開かれるページにあたるHTMLファイルの名前をindex.htmlにするようにしていますので、サイトにアクセスされた時にフレームを切るのであれば、上記のようにファイル名を変える必要がありますね。 あと、フレームに関しての注意点ですが… フレームを利用することができないブラウザもあります。 そういったブラウザでページを開かれた場合にも、正常にファイルを表示させられるような対策を入れておくほうが、みんなに見てもらうページということを重視すると、より良いと思います。 フレーム未対応のブラウザに向けての対策ですが、フレームをセットするHTMLファイル内でnoframesタグを使用してその中にフレーム未対応のブラウザのためのHTMLソースを書いておくのが良いかと思います。 具体的には、前掲のソースを流用すると、 <html> <head> <title>サイトの名前</title> </head> <frameset cols="*,400,*" border="0"> <frame> <frame src="top.htm"> <frame> <noframes> <body> <!--フレーム未対応ブラウザに対するHTMLソース--> </body> </noframes> </frameset> </html> このような感じにしておけば、フレームに対応していないブラウザではnoframes要素内のHTMLが表示されるようになります。 (前回のソース、framesetの終止タグをタイプミスしてましたね。失礼しました。) あと、フレームを切った自サイトから、他のサイトへのリンクを張る場合は、そのリンクの書き方を少し改める必要があります。 通常のリンクは「<a href="http://****/">link</a>」のように記述しますが、フレーム内に表示されているファイルがこのままの記述だと、同じフレーム内にリンク先のファイルを読み出します。 他のサイトへのリンクの場合、フレームを残しておくと、場合によっては他のサイトを自分のサイトの内容のように見せていると言うことで問題になるかもしれませんので、他サイトへのリンクを張る場合にはフレームを解除するようなリンクの張り方をする必要があります。 フレームを解除するリンクの張り方ですが、「<a href="http://******/" target="_top">link</a>」のように、「target="_top"」をタグに追加します。 こうすれば、そのリンク先のファイルを、フレームを解除して表示させることができます。 たびたび長文失礼しました。

kirihito
質問者

お礼

ありがとうございました。 お礼が遅くなりましたが、 実際やってみて、半分くらい理解できました(涙)。 なんとか参考URLなどを見ながらですが、作成できました。ありがとうございます。(不明な点が出てくるとは思いますが・・・) フレーム未対応の方ようの設定や、リンク先を全画面・または新画面で開く設定は、 ビルダーの機能を使ってやっていたのですが、 タグも覚えておこうと思います。 いろいろありがとうございました。 また新たな疑問が出たら、ぜひおつきあいください!!

その他の回答 (2)

noname#199778
noname#199778
回答No.2

ブラウザ中央に縦長の表示枠を取って、そこに内容を書く方法としては、フレームを使った方法と、スタイルシートを使った方法が考えられます。 フレームを使った方法については、以下のソースのHTMLファイルを作り、トップのHTMLファイルに代えればよいでしょう。 <html> <head> <title>サイトの名前</title> </head> <frameset cols="*,400,*" border="0"> <frame> <frame src="top.htm"> <frame> </framset> </html> framesetタグの「cols="*,400,*"」の部分が、フレームの表示枠の大きさを規定しています。 colsで左右に分割し、その枠の横幅をそれぞれピクセル単位で指定します。 *は自動調整をさせるときに入れます。 二つ目のframeタグのsrcで、トップページのファイルを指定すれば、中央にトップページ、左右は空白という表示になると思います。 スタイルシートを使う場合は、 <div style="width: 80%; height: 500px; margin: 0 10%; overflow: scroll"> ~~ </div> で各ページのbody要素内のすべてを括ってやると、フレームで区切ったような表示に見せることができます。 こちらについては、上記のような指定方法がすべてと言うわけではないので、スタイルシートについて少し知ってから使ったほうが良いかも知れません。 なお、スクロールバーも中央の表示のすぐ脇にあることにこだわらないのであれば、body要素に対して「margin-left: 10%; margin-right: 10%;」のようなスタイルシートを入れることでも、表示内容を中央に寄せることが可能です。 こちらのケースでしたら、bodyタグに直接スタイルシートを書いて<body style="margin-left: 10%; margin-right: 10%;">のようにしても良いでしょうし、あるいはhead内で <style type="text/css"><!-- body{margin-left: 10%; margin-right: 10%;} --></style> というソースを入れて、スタイルシートを導入してもよいでしょう。 また、全ページに渡って同じ効果を適用するのであれば、外部スタイルシートにこのスタイルシートを入れておいて、link要素で呼び出す方法でもよいでしょう。 スタイルシートについては、少し内容を理解していなければ扱いに困ることも多いと思うので、スタイルシートを使ったことが無ければ、余裕のあるときにでも参考URLなどを参照しながら検討してみるのがよいでしょう。 大きさを固定した別ウィンドウを開いて内容を表示したい場合は、JavaScriptを利用する必要があると思います。 こちらを使う場合は、トップページのリンクを以下のようにしてみてください。 <a href="***.htm" target="contents" onClick="window.open('','contents','width=600, height=400, scrollbars=1')">Enter</a> onClick以下にJavaScriptの処理が定義されています。 ウィンドウサイズは、widthが幅、heightが高さで、それぞれピクセル単位で指定します。 ここで開くウィンドウは、スクロールバーは表示されますが、その他のツールバーなどのバーの表示は一切無し、リサイズも無効になります。 こちらを使うときは、JavaScriptにちょっと首を突っ込んでみると、より扱いやすくなると思います。 これも参考URLで解説されているところがあるので、参照してみると良いと思いますよ。 ファイルのアップロードについては、下記のURLでFAQがまとめられているようです。 こちらも参考にされるとよいでしょう。 http://help.yahoo.co.jp/help/jp/geo/gtr/ FFFTPをはじめとしたソフトウェアの設定方法なども詳細に解説されていますので、もしFTPソフトでの更新をしたいのであれば、こちらも参照されると良いと思います。 長々と失礼しました。 参考になれば幸いです。

参考URL:
http://tohoho.wakusei.ne.jp/www.htm
kirihito
質問者

補足

ありがとうございます!! とほほさんのページ、見てたんですが、 これがフレームなんだかなんなんだかさえわからなかったので、 どこを見たものかと思っておりました。 わかりやすいご説明、ありがとうございました。 どのように調べ、応用するのかわかったような「気がします」(笑)。 実際やってみないとまだわからないと思いますので・・・ 今日帰ったらやってみます。 スタイルシートはまだムリそうです(笑) ジオのもちょっと変わっていたようで、 もう一度、読み直してみます。 調べ不足で質問させていただいて申し訳ありませんでした; ところで、フレームの説明の点ですが、やはりこの真ん中にトップのあるページを最初に表示したければ、フレーム名自体が「index.htmlになる」という事でいいのでしょうか。 もしお時間おありでしたら、(他の方もおわかりになられるのでしたら是非)教えていただけると幸いです。

回答No.1

JavaScriptで記述すればできますよ 参考URLにある、「複数行テキストボックスにメッセージを下から上へスクロール」をクリックして、こんな、イメージでしたら、そのまま使えると思いますよ それと、geocitiesは、FFTPでアップできますので、FFTPでアップロードすれば、フレーム使用しても大して苦労はしませんけどねぇ geocitiesのヘルプをもう一度読んでみると、判り易く書かれているはずですので、FFTPでのアップロード設定そして見ては如何ですか? ただ、世の中にはフレームに対応していないブラウザを使用されている方も居ますので、フレームに対応できない場合にも表示できるように、未対応の場合の記述も、しておいた方が良いでしょうね。

参考URL:
http://www.moon.sannet.ne.jp/redcap/index.html
kirihito
質問者

お礼

ありがとうございます。 説明が足らないのか、応用力がたりないのか、 ちょっとこれでは出来なさそうな感じでした・・・すみません。 まんなかのページ?のところは、普通のページとして表示したく、 ようは細長いページが中央にあり、両端のページが動かない、といった感じを想定しています。 FFTPでやってみたのですが、なかなか上手く表示されなかったので、 ちょっと断念してました。 努力してみます。 フレームページ未対応の方への記述にも気をつけてみますね。 ありがとうございました。 他のコンテンツも参考になりそうです。

関連するQ&A