締切済み

このホームページはインラインフレーム？ですか？

2014/06/07 14:21

wordpressを勉強してる初心者です。色々調べていると、このホームページの仕様が気になりました。 https://w3g.jp/ ナビゲーションからページ移行をしてもヘッダー部分が変わらないように見えます。アドレスは変化していますが、、htmlをのぞいてもiframeは無いようで。。。みなさん、よろしくお願いします。

hayato_you
お礼率66% (2/3)

JavaScript
回答数3
ありがとう数2

みんなの回答 （3）
専門家の回答

みんなの回答

ORUKA1951
ベストアンサー率45% (5062/11036)

2014/06/07 17:38 回答No.3

極々簡単な例を ★タブは＿に置換してあるので戻す。 ★HTML4.01strict + CSS2.1 8627355.html 8627355-2.html 8627355-3.html 8627355-4.html と四つのHTMLを下記部分だけ書き換えて置く。 navi.cssを同じ場所に置く [navi.css] @charset "Shift_JIS"; html,body{margin:0;padding:0;} h1,h2,h3,h4,h5,h6{margin:0;line-height:1.6em;} p{text-indent:1em;} div.header,div.section,div.footer{width:90%;min-width:630px;max-width:900px;margin:0 auto;padding:5px;} div.section{position:relative;min-height:300px;} div.section div.nav ol{position:absolute;top:0;left:0;width:160px;list-style:none;margin:0;padding:0;line-height:2em;text-align:center;} div.section h2,div.section p{margin-left:170px;} div.section div.nav ol li{margin:2px 0;padding:0;position:relative;} div.section div.nav ol li a{display:block;width:100%;height:100%;text-decoration:none;border:ridge 2px blue;background-color:aqua;} div.section div.nav ol li a[href]:hover{background-color:silver;} [8627355.html～8627355-4.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> ＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> ＿<title>トップ</title> ＿<meta name="author" content="ORUKA1951"> ＿<meta http-equiv="Content-Style-Type" content="text/css"> ＿<link rel="stylesheet" type="text/css" media="screen" href="./navi.css"> ＿<style type="text/css">  ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>トップ</h1> ＿</div> ＿<div class="section"> ＿＿<h2>見出し</h2> ＿＿<p>ここには本文記事が入る。</p> ＿＿<div class="nav"> ＿＿＿<ol> ＿＿＿＿<li><a href="./8627355.html">Top</a></li> ＿＿＿＿<li><a href="./8627355-2.html">2ページ</a></li> ＿＿＿＿<li><a href="./8627355-3.html">3ページ</a></li> ＿＿＿＿<li><a href="./8627355-4.html.html">4ページ</a></li> ＿＿＿</ol> ＿＿</div> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2013-03-03</dd> ＿＿</dl> ＿</div> </body> </html> 書き換える部分 [8627355.html] div.section div.nav ol li a[href="./8627355.html"]{background-color:gray;} [8627355-2.html] div.section div.nav ol li a[href="./8627355-2.html"]{background-color:gray;} [8627355-3.html] div.section div.nav ol li a[href="./8627355-3.html"]{background-color:gray;} [8627355-4.html] div.section div.nav ol li a[href="./8627355-4.html"]{background-color:gray;}

質問者

お礼 2014/06/08 13:08

ORUKA1951さん貴重なお時間の中ありがとうございました。 ssiでテンプレートをインクルードさせ動的な読み込みでjavascript等の動作も調べてみます。

ORUKA1951
ベストアンサー率45% (5062/11036)

2014/06/07 14:57 回答No.2

　iframe--フレームを使用していませんから、移動先をそのままブックマークできますね。その意味もあって、極力iframeやframeは使わないほうウが良いです。　各ページのパーツはSSIを使って書き出せば、すべてのページにナビゲーションを記入しなくても良いです。移動先でスタイルシートをちょっと追加しとけばよいです。