今だけ人気マンガ100円レンタル特集♪

フレームを使ったページの全体の幅を固定したいのですが、どうやったら出来るのでしょうか?

基本的にフレームは使わないほうがいいとかそういうことではなくて、フレームを使ったページの全体の幅をたとえば780pxに固定できるか否か、出来るのならばその方法を教えてください。

サンプルを添付します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title></title>
<style type="text/css">
.container
{
width: 780px;
}
</style>
</head>
<div class="container">
<frameset rows="180,*" cols="*" framespacing="2" frameborder="yes" border="2">
<frame src="header.html" name="topFrame" id="topFrame" title="topFrame">
<frameset cols="180,*" frameborder="yes" border="2" framespacing="2">
<frame src="mokuji.html" name="leftFrame" id="leftFrame" title="leftFrame">
<frame src="honbun.html" name="mainFrame" id="mainFrame" title="mainFrame">
</frameset>
</frameset>
</div>
</html>

このQ&Aに関連する最新のQ&A

A 回答 (1件)

ブランクページを追加すれば、leftFrameとmainFrameの合計で780pxに出来ます。



<frameset cols="180,600,*" frameborder="yes" border="2" framespacing="2">
<frame src="mokuji.html" name="leftFrame" id="leftFrame" title="leftFrame">
<frame src="honbun.html" name="mainFrame" id="mainFrame" title="mainFrame">
<frame src="about:blank" name="blank" id="blank" title="blank">
</frameset>


それ以外にも、個々のページで幅を固定すれば幅は固定されます。

header.htmlの<body>を780pxに固定
leftFrameに表示するページの幅を180pxに固定
mainFlameに表示するページの幅を600pxに固定
    • good
    • 0
この回答へのお礼

ありがとうございます。

ヒントをもとに、いろいろ工夫してみましたら、どんな画面サイズでも各フレームの幅を固定し、かつ、フレーム全体を必ず中央に表示し(左右のダミーフレーム部分を均等に左右に配置し)、どのブラウザでもダミーフレームの部分を灰色にすることができました。

この方法が使えれば、フレームページもまだまだメリットありますね・・・。

最初にフレームに慣れてしまって、最近の横に長い画面に悩まされていた私には大変な朗報でした。

長年、実に長年です。長年の悩みが解消されました。
ありがとうございました。

お礼日時:2009/09/28 22:45

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qフレーム分けしたHPを中央表示したいのですが、分かる方ご指導ください。

フレームで上と左右の3つに分けています。
下記のように、左によってしまいますが、
フレーム分けした場合は仕方ないのでしょうか?
http://www.twinklecloset.com

下記のHPのように、全体を中央表示したいのですが、
http://www.seven-rag.com/sr.html
もし分かる方、ご指導ください。
余白の背景は黒にしたいと考えています。

Aベストアンサー

参考となるサイトがあるのなら、そのサイトのソースをまずは見てみましょう。それだけで回答を得ることも出来ますよ。

さて、参考サイトのフレームですが、以下のような作りになっています。

<HTML>
<HEAD>
<TITLE>seven-rag.com</TITLE>
<FRAMESET COLS="*,865,*" frameborder="0" framespacing="0"
framepadding="0">
<FRAME SRC="whitespace0.html" NAME="c" frameborder="0"SCROLLING="no" NORESIZE>
<FRAME SRC="sr0.html" NAME="menu" frameborder="0"SCROLLING="no" NORESIZE>
<FRAME SRC="whitespace0.html" NAME="c" frameborder="0"SCROLLING="no" NORESIZE>
</FRAMESET></head>
</html>

---------------
FRAMESET COLS="*,865,*" が問題のところですね。
中心が865、残りはブラウザサイズに合わせて自動調整となっています。
http://www.asahi-net.or.jp/~ax2s-kmtn/ref/html/hp7.html
これで、真ん中のフレームを自動的に中心におくことができますよ。

参考URL:http://www.asahi-net.or.jp/~ax2s-kmtn/ref/html/hp7.html

参考となるサイトがあるのなら、そのサイトのソースをまずは見てみましょう。それだけで回答を得ることも出来ますよ。

さて、参考サイトのフレームですが、以下のような作りになっています。

<HTML>
<HEAD>
<TITLE>seven-rag.com</TITLE>
<FRAMESET COLS="*,865,*" frameborder="0" framespacing="0"
framepadding="0">
<FRAME SRC="whitespace0.html" NAME="c" frameborder="0"SCROLLING="no" NORESIZE>
<FRAME SRC="sr0.html" NAME="menu" frameborder="0"SCROLLING="no" NORESIZE>
<FRAME SRC="...続きを読む

Qインラインフレームの表示位置を指定したい

インラインフレーム自体の表示位置を指定したいと思っています。
ページの大きさに対して中央に、
インラインフレームのページを表示したいと思っているのですが、

横位置は、ALIGN="center"を使って指定出来きましたが、
縦位置の指定が出来ないでいます。

色々と検索してみたのですが、
もしかしたら出来ないのでは。。。とも思っています。
ですが、Web上には中央に配置されるページとかもあるので、
出来ないはずはないのですが、
タグをみても量がおおくてわかりません^^;

恐れ入りますがよろしくおねがいしますm(__)m

Aベストアンサー

高さと幅が固定されていれば、以下のcssが有効のようです。
<style type="text/css">
<!--
#center{
height:200px;
width:500px;
position:absolute;
top:50%;
left:50%;
margin-top:-100px;
margin-left:-250px;
border:solid 1px #666666;
}
-->
</style>

<iframe src="" name="" id="center">
インラインフレームを使用しています。
</iframe>

Qframeset要素を使わずに画面を分割したい

アンテナ(下記サイト)のように左にメニュー画面を、右にコンテンツを表示するホームページを作成したいと考えています。
https://antenna.jp/

ひとつのウインドウで画面を2つにわけるためにはhtmlのframeset要素を使えばできることは把握しているのですが、上記サイトのアンテナではframesetを使わずに画面分割をしています。

見た目やレスポンシブ対応のしやすさも考え、できればframesetを使わずに画面分割を行いたいのですが、どのようにすれば可能でしょうか。
メニュー部分とコンテンツ部分を別々にスクロールできるようにしたいです。

どなたか分かる方教えてください。

Aベストアンサー

長くなるから、参考ページ参照。

参考URL:http://www.geocities.jp/eijispace/2012/0419.html

Q外部ファイルを実行

javascriptで
<script type="text/javascript" src="test.js" ></script>
を記述すると、
HTML読み込み時にtest.jsを実行するのですが、
ボタンクリック時に外部ファイルを実行するコードはどのように記述すればいいのでしょうか?

よろしくお願いします。

Aベストアンサー

当方、本日手が空いたので色々試行錯誤してみましたが
javascriptを動的に呼び出すのは少し難しいようですな。

[test.js]
function test() { alert('moge'); }
というファイルがあるとして、


[例1]
<input type='button' value='go' onclick='on()' />
<script type='text/javascript'><!--
function on(){
 document.write('<script type="text/javascript" src="./test.js"></script>');
}
// --></script>

これだとグローバルスコープでtest.jsの定義が使えるのですが、
画面が再描画されるため意図した動作をせず。
再描画させず、意図させた場所のみ更新させHTMLparseを行わせるという挙動ってできるのですかねぇ。


[例2]
<input type='button' value='go' onclick='on()' />
<script type='text/javascript'><!--
var jsStr = "";
function on(){
 getCode();
 eval(jsStr);
 test();
}

function getXMLHTTPObj(){
 try{
  return new ActiveXObject("Msxml2.XMLHTTP");
 }catch(e){
(snip.)
 }
}
function getCode(){
 // make instanse
 var reqSend = getXMLHTTPObj();
 // get instanse
 if(reqSend){
  reqSend.onreadystatechange = function(){
   if(reqSend.readyState == 4 ){
    jsStr = reqSend.responseText;
   }
  }
  reqSend.open('POST', "./test.js", false);
  reqSend.setRequestHeader('content-type', "application/x-www-form-urlencoded;charset=UTF-8;");
  reqSend.send();
 }
}
// --></script>

XMLHTTPで呼んでevalしてみる。
使えなくもないですが・・・・
最初から<script>で呼べよという話に。


[例3]
<script src="common1.js"></script>
<script src="common2.js"></script>
<script src="common3.js"></script>
<script src="test.js"></script>(typeはsnip)
<input type="button" onclick='test()' />

スタンダード。
必要な奴は必要なときに逐次呼ぶのが普通。


外部読み込みはprototype.jsとかにありそうな気はしますけどね。
使ったことないですが。

当方、本日手が空いたので色々試行錯誤してみましたが
javascriptを動的に呼び出すのは少し難しいようですな。

[test.js]
function test() { alert('moge'); }
というファイルがあるとして、


[例1]
<input type='button' value='go' onclick='on()' />
<script type='text/javascript'><!--
function on(){
 document.write('<script type="text/javascript" src="./test.js"></script>');
}
// --></script>

これだとグローバルスコープでtest.jsの定義が使えるのですが、
画面が再描画さ...続きを読む

QHTMLフォームのSELECTの幅を一定にするためには?

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか?

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">

Qフレームの中にフレーム

こんにちは。
HTMLでフレームの中にフレームを作ったりってできるのですか?
できるようでしたら書き方も
教えてください。お願いします。

Aベストアンサー

今日は。出来ますよ。
左右のフレーム内の右側に上下のフレームを入れるとしますね。
まず、上下のフレームページを作ります。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title></title>
</head>
<frameset rows="*,*">
<frame name="top" src="ue.htm">
<frame name="bottom" src="shita.htm">
<noframes>
<body>
<p>このページにはフレームが使用されていますが、お使いのブラウザではサポートされていません。</p>
</body>
</noframes>
</frameset>
</html>
これを「right.htm」とでもして保存します。
次に、左右のフレームを作ります。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title></title>
</head>
<frameset cols="*,*">
<frame name="left" src="left.htm">
<frame name="right" src="right.htm">
<noframes>
<body>
<p>このページにはフレームが使用されていますが、お使いのブラウザではサポートされていません。</p>
</body>
</noframes>
</frameset>
</html>
左側には通常のページを置きますが、右側には先程作成した「right.htm」を配置します。

これで、フレームの入れ子のページが出来上がります。簡単です。

今日は。出来ますよ。
左右のフレーム内の右側に上下のフレームを入れるとしますね。
まず、上下のフレームページを作ります。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title></title>
</head>
<frameset rows="*,*">
<frame name="top" src="ue.htm">
<frame name="bottom" src="shita.htm">
<noframes>
<body>
<p>このページにはフレームが使用されていますが、お使いのブラウザではサポートされていません。</p>
</body>
</noframes>
</fram...続きを読む

Qform の target(

form タグに
オプションとして存在する target に関してです。

form method="POST" action="***.cgi" target="new"

と記述すればsubmit実行時に結果を別ウィンドウに転送します
ここまではいいのでが・・・・

submitボタンが複数ある場合(ボタンによって処理が違う)
ボタンによって、このボタンは新しいウィンドウを開くが、
このボタンは開かない(同一ウィンドウ内に結果表示する)
というように設定することはできますか?

CGIとJavaSCRIPTの利用は可能です。
やはり別の form を立てるしかないのでしょうか?
(cgiに渡す値が大量なため一つのformで実現したいとおもっています)

Aベストアンサー

>新しいウィンドウは target="new" を使っています。
この場合、newという名前がついたwindowが新たに開かれますよね。
もう一度newをtargetとしたページを開いた場合、さっき開いたnewウィンドウに読み込まれます。
targetにはいくつか特別な値を入れることができます。
_blank  名前未設定の「新しい」ウィンドウを開きます。10回やれば10個新しいウィンドウが開きます。
_self   自分自身のウィンドウをターゲットとします。(フレームならフレーム)
_parent  フレーム構造の場合、自分自身の一つ上のフレームセットを解除してターゲットとします
_top   フレーム構造の場合、(階層が深くても)全部解除してターゲットとします。


>☆結果
>1.両方ともに新しいウィンドウが立ちあがります。
if文が間違っています。re=1という記述は代入ですので、条件判断としては・・・。

>2.buttonのvalue値が渡されません。
type="button"は送られないようですね。buttonの名前&値がほしい場合はNo.3の方が
かかれているようにsubmitにonClickを使う形になりますか。
この場合、ブラウザにJavaScriptの動作終了を待たずにsubmitしてしまうようなバグがあったらオワリなんですが・・・動くみたいなので大丈夫でしょう。

>新しいウィンドウは target="new" を使っています。
この場合、newという名前がついたwindowが新たに開かれますよね。
もう一度newをtargetとしたページを開いた場合、さっき開いたnewウィンドウに読み込まれます。
targetにはいくつか特別な値を入れることができます。
_blank  名前未設定の「新しい」ウィンドウを開きます。10回やれば10個新しいウィンドウが開きます。
_self   自分自身のウィンドウをターゲットとします。(フレームならフレーム)
_parent  フレーム構造の場合、自分自身の一...続きを読む

Qテキストボックスの入力をリセット

ボタンが押されたら、テキストボックスの入力内容を削除するにはどうしたらいいでしょうか?

Aベストアンサー

こんな感じ。

<form>
<input type=button value="clear" onClick="this.form.t.value = ''">
<input type=text size=50 name=t>
</form>

ボタンの this.form.t の t が、テキストの名前になっていて、押されると
空の文字列を入れる、だけです。

もし、フォーム全体のテキストをクリアするならば、こんな方法もあります。

<form>
<input type=button value="clear" onClick="this.form.reset()">
<input type=text size=50 name=t1>
<input type=text size=50 name=t2>
<input type=text size=50 name=t3>
</form>

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
<TD>タグや<TR>タグのところでいじくるのですか?

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
#2の方法ですね。

テーブルごとやセル(<TD>)ごとにサイズを変更するには
スタイルシート(CSS)を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル(<TD>)ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

#1の方法だとページ内の全てのセル(<TD>)に設定することになります。

スタイルシート(CSS)はこれら以外にも
いろいろな設定方法があります。

Qフレームとiframeの違い

今、タグを調べているのですが、frameとiframeの違いが分かりません。
私にはどちらもブラウザを分割して表示するもの程度にしか理解できません。
どなたか分かりやすく説明して頂けないでしょうか?
分かる方には初歩的な質問だと思うのですが、考え方が悪いらしく、まったく理解できません。
ご教授お願い致します。

Aベストアンサー

frame は画面を左右に分割したり、上下に分割したりできますよね?
でも、 iframe は、分割する、というのとは少し違います。
iframe は、画面上の好きな位置に、好きな大きさで HTML を表示させることができます。
つまり、iframe は、「画面上に HTML ファイルを埋め込むもの」と考えれば分かりやすいと思います。


人気Q&Aランキング