PHPで左ナビゲーション機能を実装する方法
- PHPzオリジナル
- 2023-04-11 15:07:40772ブラウズ
Web アプリケーションの急速な発展に伴い、Web サイト アプリケーションはますます複雑になり、インターフェースもますます複雑になってきており、ユーザーにとってシンプルで使いやすいインターフェースは特に重要です。左側のナビゲーション バーは、Web アプリケーションの古典的な UI デザインで、ユーザーに必要なナビゲーションおよび操作機能を提供します。以下では、PHP で左ナビゲーションを実装する方法を紹介します。
1. HTML
まず、HTML コードを記述する必要があります。左側の列では、ul 要素と li 要素を使用して、垂直に配置されたナビゲーション バーを実装できます。例:
<ul> <li><a href="#">导航项1</a></li> <li><a href="#">导航项2</a></li> <li><a href="#">导航项3</a></li> <li><a href="#">导航项4</a></li> <li><a href="#">导航项5</a></li> </ul>
ここでは、 a 要素を使用してナビゲーション リンクを表示します。つまり、ユーザーがナビゲーション項目をクリックすると、対応するページにジャンプします。 CSS を使用してナビゲーション バーを美しくすることができます。
2. PHP
次に、php を使用して左側のナビゲーションを実装します。 PHP は HTML コードを簡単に生成し、それをデータベース内のコンテンツと高度に統合できます。たとえば、php コードを使用して、データベースからナビゲーション項目を取得できます。
<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检测连接
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
$sql = "SELECT id, title, link FROM navigation";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// 输出数据
while($row = $result->fetch_assoc()) {
echo "<li><a href='" . $row["link"]. "'>". $row["title"]. "</a></li>";
}
} else {
echo "0 结果";
}
$conn->close();
?>
このコードでは、データベースに接続し、データベースからナビゲーション項目を抽出します。次に、while ループを使用してナビゲーション項目を出力し、接続とタイトルをデータベースから取得します。
3. 完全なコード
最後に、HTML と PHP コードを結合して、完全な左側のナビゲーションを生成します。
<!DOCTYPE html>
<html>
<head>
<style>
/* CSS代码用于美化导航栏 */
ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 200px;
background-color: #f1f1f1;
}
li a {
display: block;
color: #000;
padding: 8px 16px;
text-decoration: none;
}
li a.active {
background-color: #4CAF50;
color: white;
}
li a:hover:not(.active) {
background-color: #555;
color: white;
}
</style>
</head>
<body>
<!-- HTML代码用于创建左侧导航栏 -->
<ul>
<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
$sql = "SELECT id, title, link FROM navigation";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "<li><a href='" . $row["link"]. "'>". $row["title"]. "</a></li>";
}
} else {
echo "0 结果";
}
$conn->close();
?>
</ul>
</body>
</html>
概要
PHP を介して左側のナビゲーションを実装すると、動的データを簡単に処理できるため、Web サイトの UI デザインがより柔軟になり、保守と調整が容易になります。この記事で紹介した方法を通じて、PHP で左ナビゲーションを実装する方法をよりよくマスターできます。
以上がPHPで左ナビゲーション機能を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。