0

これを説明する方法がわからないため、タイトルがあまり明確ではない可能性があります。私は自分のhtmlを作成しています（1回限りの作業なので、Javaは使用しません。cssを使用したプレーンなhtmlのみです）。

この回路図を考えてみましょう( Pic 1)。左側のパネルとフッターは、Web サイトのすべてのページでほぼ同じで、Web サイト内の他のページへのリンクが含まれています。

|================================|
||-------||------------||------| |
||LEFT   ||CENTER      ||RIGHT | |
||PANEL  ||PANEL       ||PANEL | |
||_______||____________||______| |
||_______________________________|
||  FOOTER                       |
||_______________________________|
|================================|

Pic.1 ウェブページのレイアウト

|------------------------|
|                        |
|link to pA              |
|link to pB              |
|                        |
|current link highlited  |
|------------------------|

pic2. 左パネルのレイアウト

しかし、私の現在の知識では、左側のパネルとフッターを変更しようとすると、すべてのページを変更する必要があります。この左側のパネルを別のファイルに書き込んで、必要な場所に含めることはできますか?

また、おそらく別の質問ですが、左のパネルを別のファイルに書き込むことが可能であると仮定すると、リンクされています。現在アクセス中のページリンクを強調表示することはできますか?( を参照Pic 2)

4

1 に答える 1

0

EDIT すみません、注意が足りませんでした。PHPを使用していませんか？その場合は、 HTML5 インクルード ファイルを見てください。

ただし、メイン ページとインクルード ファイルの間でデータを共有する方法が見つかりませんでした。可能であれば、インクルードされたファイルで#タグを使用することもできます。たとえばmypage.html#hello、JavaScript でタグを解析して、アクセスしているページを見つけます。

あなたは実質的にあなた自身の質問に答えます。HTMLコードを取り出して別のファイルに入れて、元の場所に含めるだけです。

あなたのコードが

<div id="main">
    <div id="left-panel">
        <div id="links etc"></div>
    </div>
    <div id="another"></div>
</div>

その部分を取り出してleft-panel別のファイルに入れ、元の場所に含めます。

left-panel.php

<div id="left-panel">
    <div id="links etc"></div>
</div>

元のファイル

<div id="main">
    <?php include 'left-panel.php'; ?>
    <div id="another"></div>
</div>

現在アクセスしているページを知るには、変数を使用できます。あなたが入れた各ページで<?php $page = 'shop'; ?>、内部でleft-panel.php次のようなifステートメントを使用してください：

<ul>
    <li><a href="page1.php" <?php if($page == 'page1') echo 'class="active"'; ?>>Page1</li>
    <li><a href="page2.php" <?php if($page == 'page2') echo 'class="active"'; ?>>Page2</li>
</ul>

一連の if ステートメントを避けるために、ページを配列に配置してループすることができます。

<ul>
<?php
$pages = array('page1' => 'Page1', 'page2' => 'Page2', 'page3' => 'Page3');
foreach($pages as $file => $name) {
    echo '<li><a href="'.$file.'" '.($page == $file ? 'class="active"' : '').'>'.$name.'</a></li>';
}
?>

于 2013-10-06T09:16:42.267 に答える