すべてのWebページで共通のナビゲーションバーが必要なので、すべてのWebページでHeader.html
を作成し、<?php include('Includes/Header.html') ?>
を使用して各ページの上部にナビゲーションバー/ 。PHPを使用してナビゲーションバーの上に動的Webページのコンテンツが表示される
しかし、動的コンテンツを(PHPを使用して)Webページの本文に追加しようとすると、ページの内容がナビゲーションバー/ヘッダーの「上に」表示され、その理由を理解できません。 Item_List.php
ため
<?php
session_start();
include('Includes/Header.html');
include('Item_List.php');
?>
コード:
<?php
//connect to the database
try{
$db = new PDO("mysql:dbname=...;host=localhost", "...", "...");
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$rows = $db->query("SELECT Catagory, Colour, Found_Place, Found_Date FROM Item");
foreach ($rows as $row) {
?>
<div class="item_div">
<ul>
<li><?= $row['Catagory'] ?></li>
<li><?= $row['Found_Place'] ?></li>
<li><?= $row['Found_Date'] ?></li>
<li><?= $row['Colour'] ?></li>
</ul>
</div>
<?php
}
}catch(Exception $e){
echo 'Caught exception: ', $e->getMessage(), "\n";
}
?>
いくつかについてはここで
は、ここで問題があるあるSearch.php
ためのコードがある
Header.html
<!DOCTYPE html>
<head>
<title>Home</title>
<style>
body
{
margin:0;
background-repeat: no-repeat;
background-position:center;
background-attachment:fixed;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed; /* Set the navbar to fixed position */
top: 0; /* Position the navbar at the top of the page */
width: 100%; /* Full width */
}
li {
float: left;
border-right:1px solid #bbb;
}
li:last-child {
border-right: none;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
form
{
margin: 0;
padding: 12px;
text-align: center;
padding-right: 30px;
}
form input
{
display: inline;
}
.spacer
{
width: 100%;
height: 95px;
}
.answer {
background-color: #DCDCDC;
}
</style>
</head>
<body>
<ul>
<li><a href="#home">Home</a></li>
<li><a class="active" href="Search_Found_Items.php">Search Items</a></li>
<li><a href="Report_Found_Item.php">Report Found Item</a></li>
<li style="float: right; color: White">
<?php
if(isset($_SESSION['email']))
{
echo "{$_SESSION['email']}";
echo " ";
echo "<a href='Logout.php'>Logout</a>";
}else{
include('Includes/Login_Form.html');
echo "<a href='Register.php'>Register</a>";
}
?>
</li>
</ul>
のコードです理由が内容の内部Item_List.php
は、Header.html
のコンテンツの上にレンダリングされます!私はSearch.php
の底にItem_List.php
の内容を追加しようとしましたが、同じことが起こります。たくさんの改行を加えることはどちらもうまくいかないようです。イメージリンクをクリックすると、私の意図がわかります。申し訳ありませんが、イメージはわずかに不明瞭ですが、「ホーム、検索」などのすぐ上には、ナビゲーションバーの下にレンダリングする必要があるデータ行があります。
私はとても混乱している助けてください!
ありがとうございます。間違ったCSSほどシンプルで、私は技術的にも頭の上でも何かを期待していたと信じられません。 – HelloWorld
喜んでそれが助けられました:-) – jrn