gpt4 book ai didi

php - 导航栏下拉菜单不出现

转载 作者:太空宇宙 更新时间:2023-11-04 07:15:02 25 4
gpt4 key购买 nike

在我的网站上,我创建了一个 NavBar 文件,并将它与 php 一起包含在我想要的所有其他 php 文件中。现在我的导航栏文件里面有一个下拉菜单:

.dropdown .dropbtn {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
cursor: pointer;
}

.dropdown-content {
display: none;
position: absolute;
background-color: white;
min-width: 160px;
box-shadow: white;
z-index: 1;
cursor: pointer;
}

.dropdown-inbuttons {
border: none;
padding: 6px 12px;
text-decoration: none;
display: inline-block;
cursor: pointer;
background-color: white;
color: black;
}

.dropdown {
position: relative;
display: inline-block;
}

.dropdown-content {
display: none;
position: absolute;
right: 0;
background-color: white;
min-width: 160px;
box-shadow: white;
z-index: 1;
cursor: pointer;
}

.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}

.dropdown:hover .dropdown-content {
display: block;
}
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">


<div class="w3-top">
<div class="w3-bar w3-black w3-card" style="height: 58px">
<!-- Give attension here -->
//.....other code....//
<div class="dropdown" style="margin-top: 6px;">
<button class="dropbtn">
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="../../../../registration/_includes/logout-system.php">Log Out</a>
</div>
</div>
</div>

</div>

当我将鼠标放在 dropbtn 上时,它会显示: enter image description here

我知道为什么会发生这种情况,因为下拉内容位于导航栏内,并且在代码导航栏 height = 58px 中不适合。那么如何使我的下拉列表在其他 html 文件的前面可见?<​​/p>

我用这种方式在其他 php 文件中导入导航栏:

<html>
<?php
session_start();

if(!isset($_SESSION['u_id'])){
header("Location: ../../login.php");
}
include '../../_includes/server.php';
$userid = $_SESSION['u_id'];
$usersql = "SELECT * FROM `users` WHERE id='$userid'";
$result = mysqli_query($conn, $usersql);
if($row = mysqli_fetch_assoc($result))
{
$_SESSION['first_name'] = $row['first_name'];
$_SESSION['last_name'] = $row['last_name'];
include('../../../navBar/navBarConnected.php'); <!-- Here I include it-->
}
<head>...</head>
<body>...</body>
</html>

最佳答案

第一种方法:覆盖 overflow:hidden.w3-bar通过 overflow:visible .

第二种方法:更改position: relative.dropdown类别为 position: static并包装 <div class="dropdown">...</div>到另一个 div 并添加 position: relative对此。

两者都可以。选择适合您的内容。

关于php - 导航栏下拉菜单不出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50797958/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com