- 締切済み
フレームHTMLについて。
サイトを作るにあたって、画面を二分割にしようと思っていますが、どうにも作る事が出来ません。 サイト様を見ても分からない上に、とりあえず解説通りに実行しても良く分からない事になる。・・そんな状態がかれこれもう4ヶ月になります。 もうサイト自体を諦めようか・・と思いましたが、最後にここで質問をして諦めるかどうかを決めようと思っています。 そんな私が恥を忍んでお願いをします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html lang="ja"> <!--made by Web Design Templates http://wdt.pekori.jp/--> <head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <title></title> <style type="text/css"> <!-- body{ margin: 0; font-size: 10pt;/*全体のフォントサイズ*/ } a{ color: #212122;/*リンクの色*/ text-decoration: none; } .leline{/*裏側の細線の設定*/ position: absolute; z-index: 1 top: 0; left: 100px; width: 10px; height: 100%; border-left: solid 1px #ABABAC;/*色*/ } .leline2{/*裏側の薄色部分と点線枠の設定*/ position: absolute; z-index: 1; top: 0; left: 120px; width: 130px;/*幅*/ height: 100%; border-left: dotted 1px #ABABAC;/*枠の色*/ border-right: dotted 1px #ABABAC; background-color: #FBFBFC;/*背景色*/ } .main{/*メニュー全体の位置と幅を設定*/ position: absolute; z-index: 2; top: 25px; left: 60px; width: 240px; } h1{/*SiteTitle部分の設定*/ font-size: 12pt; font-family: "Verdana"; font-weight: normal; letter-spacing: 0.2em;/*文字間隔*/ text-align: center; width: 220px; margin: 10px 10px 40px 10px; padding: 5px 15px 5px 15px; border: solid 1px #696969; background-color: #FFFFFF;/*背景色*/ } .menu{/*メニューの設定*/ margin: 10px;/*メニューごとの間隔*/ padding: 5px; border: solid 1px #696969;/*枠の色*/ background-color: #FFFFFF;/*背景色*/ font-family: Verdana; font-size: 10pt; } .text{/*「一言」部分*/ margin: 20px 10px 10px 10px; padding: 5px; border: solid 1px #696969; background-color: #FFFFFF; font-family: Verdana; font-size: 9pt; } .bottom{/*アドレス部分*/ margin: 40px 10px 10px 10px; padding: 5px; border: solid 1px #696969; background-color: #FFFFFF; font-family: Verdana; font-size: 7pt; text-align: center; } --> </style> </head> <body> <div class="leline"></div> <div class="leline2"></div> <div class="main"> <h1>Site Title</h1> <div class="menu">■ <a href="#">What's New</a></div> <div class="menu">■ Sitemap</div> <div class="menu"><span style="color: #AA4548">■</span> Text <span style="font-size: 8pt">- 12/13</span></div> <div class="menu">■ Photo</div> <div class="menu">■ Bookmark</div> <div class="text"> [一言スペース]<br> <br><br><br> </div> <div class="bottom">Since 2001.12.10 // E-mail</div> </div> </body> </html> ↑これに既にフレームを付けた状態のHTMLを切実に待っています。 これをインターネットで表示すると、http://wdt.pekori.jp/template/top/007/007_gray.html←の様になります。
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- アプ(@skm36522)
- ベストアンサー率49% (80/161)
単純にフレーム分割なら、下記で分割可能です。 framepage2.html ←このファイル実行 pageNavi.html pageDetail.html [framepage2.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <FRAMESET cols="35%,65%"> <FRAME name="frame1" src="pageNavi.html"> <FRAME name="frame2" src="pageDetail.html"> <NOFRAMES> <BODY> <P>このページを表示するには、フレームをサポートしているブラウザが必要です。</P> </BODY> </NOFRAMES> </FRAMESET> </HTML> [pageNavi.html] 質問者様が定時したHTMLソース [pageDetail.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <BODY></BODY> </HTML>
- アプ(@skm36522)
- ベストアンサー率49% (80/161)
単純にフレーム分割なら、下記で分割可能です。 framepage2.html ←このファイル実行 pageNavi.html pageDetail.html [framepage2.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <FRAMESET cols="35%,65%"> <FRAME name="frame1" src="pageNavi.html"> <FRAME name="frame2" src="pageDetail.html"> <NOFRAMES> <BODY> <P>このページを表示するには、フレームをサポートしているブラウザが必要です。</P> </BODY> </NOFRAMES> </FRAMESET> </HTML> [pageNavi.html] 質問者様が定時したHTMLソース [pageDetail.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <BODY></BODY> </HTML>
お礼
ありがとうございます! これを参考に、サイト作りを頑張りたいと思います^^
お礼
ありがとうございます!! これを参考にサイト作りを頑張りたいと思います!