私は多くのhtmlページを持っています。 HTML5とCSSのみを使用してナビゲーションメニューを1か所に保存/管理することは可能でしょうか?これは、すべてのナビゲーションコードが1つのファイルにあることを意味するので、メニューが変更されたときにすべてのページでコードを編集する必要はありません。1つだけのナビゲーションバーコードページで多くのHTML5ページを使用するにはどうすればHTMLとCSSだけを使用できますか?
おかげで、 ダグラス
私は多くのhtmlページを持っています。 HTML5とCSSのみを使用してナビゲーションメニューを1か所に保存/管理することは可能でしょうか?これは、すべてのナビゲーションコードが1つのファイルにあることを意味するので、メニューが変更されたときにすべてのページでコードを編集する必要はありません。1つだけのナビゲーションバーコードページで多くのHTML5ページを使用するにはどうすればHTMLとCSSだけを使用できますか?
おかげで、 ダグラス
はい、できます。 target="content"
は、IFRAMEのリンクを変更する必要があります追加のすべてのメニュー項目より
<iframe src="menu.html"></iframe>
<iframe src="content.html" name="content"></iframe>
:初期の1990年に、人々はのiFrameを使用していました。
ウェブサーバーの機能を調べます。例えば、Apache's SSI。これは、他の人が指摘しているように、回避するのが最善の方法です。サーバー側のインクルードは、ほぼそのままのHTMLです。
あなたは
<iframe src="Header.html"></iframe>
<iframe src="restOfThePage.html" name="content"></iframe>
のようにそうするように、アイフレームを使用することができますが、これはそうするための最良の方法はありませんが、これはウェブサイトが日中に戻って建設された方法です。コードの再利用について考えているので、ハンドルバーのようなテンプレートエンジンやAngularのような完全なMVCフレームワークの使用を検討する必要があります。それはあなたに多くのこれらの種類のアプリケーションを構築するのに役立ちますが、それはあなたの履歴書にもいいです。
iframeを使用して目標を達成できます。
index.htmlファイルにナビゲーションメニューがあり、そのページにはiframe
があります。ナビゲーションメニュー内のすべてのリンクはpages
(IFRAMEの名前)の値を持つtarget
属性を持っている必要があり
<iframe name="pages" src="main.html"><iframe>
例えば:
<a href="page1.html" target="pages">page 1</a> <a href="page2.html" target="pages">page 2</a>
iframe
name
属性を持つ必要があります
このように、リンクはiframeで開き、親ページでは開かないので、nアビエーションメニューはまだそこにあります。
ちょうど別の方法での予測は、ツールを使用せずにナビゲーションを構築します。 "HTMLのみ"です。あなたは使用することができます。 navigation.js:
document.write('<div id="navigation">')
document.write('<div class="navItem">Enter your HTML (HREF)...</div>')
document.write('</div>')
は、あなたはjavascriptファイルとして保存する必要があります。その後、すべてのHTMLにそれを含めることができます:
<script type="text/javascript" src="../src/includes/navigation.js"></script>
多分役立ちます。
あなたが(i)フレームを使用していて、それはあなたがしたくないものです。他のファイルにファイルを含めることができるエディタを使用する(保存時にファイル全体が作成されるようにする)か、またはこれを動的に実行できるサーバー側の方法を使用します。 – CBroe
あなたは条件付きスタイルや、要素のステータス(:focus、:checkedなど)に基づいたCSS宣言をトリックできるはずです。TabPanel要素のように複数のビューを用意して、条件付きCSSこれを解決できるかもしれません。 – Sebas
あなたが必要とするものがメンテナンスの増加である場合、ナビゲーションパネルのHTMLコードをページの外に保存し、それを必要なすべてのページに含めるだけです。 – Sebas