人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

【htmlの文法について】

webページを上下2分割し、それぞれ違うサイトを表示したいと思います。
(例 上はgoogle、下はyahoo)

これを実現する、htmlの文法を教えて下さい。
または、実際に使われているサイトを教えて下さい。
宜しくお願いします。

●質問者: mizore_chan
●カテゴリ:インターネット ウェブ制作
✍キーワード:Google HTML Web Yahoo サイト
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● tak
●23ポイント

<frameset rows="50%,50%">

....

</frameset>



frameset のことでしょうか?

◎質問者からの返答

frameset というのですね。


2 ● noir_k
●23ポイント

<frame>タグで実現できます。

こんな感じで。

<html>

<head>

<title>上下2分割</title>

</head>

<frameset rows="50%,*">

<frame src="http://www.google.com/" name="frame1">

<frame src="http://www.yahoo.co.jp/" name="frame2">

</frameset>

<noframes>

このページはフレーム対応のブラウザでご覧ください。

</noframes>

</frameset>

</html>

通常の<body>内ではなく、<frameset>内に記述します。

<noframe>内はフレーム未対応の場合に表示されます。


使用しているサイトの例⇒http://fan.xrea.org/frame/0u-l/

実用上使われているサイトでしたら沢山あります。いわゆる「フレーム対応」サイトと言う奴です。

ひとつ例で挙げますと、http://www.nagisama-fc.com/anime/

このようなサイドバーメニューの殆どは、<frame>タグで実現されています。

◎質問者からの返答

ソースもありがとう御座います。


3 ● notvalid
●22ポイント

http://web.hosp.kanazawa-u.ac.jp/hp/h10/frame/kaisetsu.html

【上下分割表示されるページ】

 <HTML>
 <HEAD>
 <TITLE>
 [上下分割フレームの基本型]
 </TITLE>
 </HEAD>
 <FRAMESET ROWS="30%,*">
 <FRAME SRC="ue.html">
 <FRAME SRC="sita.html">
 </FRAMESET>
 </HTML>

ここのue.htmlとsite.htmlをそれぞれ表示させたいサイトのURLをhttp://から書けばOKです。

分割ラインの位置はROWS="30%,*"の30%を適当にいじってやればOKです。

◎質問者からの返答

シンプルでわかり易いです。

ありがとう御座います。


4 ● pahoo
●22ポイント

フレームを使う方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
 "http://www.w3.org/TR/REC-html40/frameset.dtd">
<html>
<frameset rows="50%,*">
<frame src="http://www.google.com/">
<frame src="http://www.yahoo.co.jp/">
</frameset>
</html>

インラインフレームを使う方法

<body>
<script language="JavaScript">
width = document.body.clientWidth - 20;
height = document.body.clientHeight / 2 - 20;
document.write('<iframe src="http://www.google.com/" width="' + width + '" height="' + height + '"></iframe><br />');
document.write('<iframe src="http://www.yahoo.co.jp/" width="' + width + '" height="' + height + '"></iframe><br />');
</script>
</body>
</html>

参考サイト

◎質問者からの返答

インラインフレームというのも有るのですね。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ