所以我现在面临这个问题几天了,我真的不知道从哪里开始解决这个问题......
当我尝试创建 hover DropDownMenu
它只是不能与我的 CSS 文件中的其他内容一起使用。
它显示按钮本身(一半)以及悬停时。它确实改变了他的颜色,但没有真正发生。
没有打开列表。
Picture of it
(从他们提供的 w3s 学校代码中复制的 CSS)
感谢您的帮助!
希望能尽快收到你们的来信。
母版代码:
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Nua </title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="assets/css/main.css" />
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<style>
.topleft {
position: absolute;
top: 0px;
left: 9%;
font-size: 16px;
}
.topLeftSecond {
position: absolute;
top: 0px;
left: 17.5%;
font-size: 16px;
}
</style>
<form id="form1" runat="server">
<% if (Session["Level"].ToString().Equals("-1"))
{ %>
<div class="icon-bar">
<a class="active" href="HomePage.aspx"><i class="fa fa-home"></i></a>
<a href="Login.aspx">Login <i class="fa fa-sign-in"></i></a>
<a href="Register.aspx">Register <i class="fa fa-pencil"></i></a>
<a class="more" href="HomePage.aspx#main">About <i class="fa fa-info-circle"> </i></a>
</div>
<%} %>
<%-- This is the Drop down menu code--%>
<%if (Session["Level"].ToString().Equals("1"))
{ %>
<div class="dropdown">
<button class="dropbtn">Here</button>
<div class="dropdown-content">
<a href="AdminArea.aspx">Link 1</a>
<a href="WorkersPage.aspx">Link 2</a>
</div>
</div>
<%} %>
<div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/jquery.poptrox.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
希望我发对了 O-o
最佳答案
三件事:
对于
.dropdown
设置display: inline-block
- 现在它具有完整的页面宽度对于
的样式中获取 32px/li>.dropdown .dropbtn
设置height: auto
- 现在它从button
您丢失了以下代码,该代码在悬停时显示菜单:
.dropdown:hover .dropdown-content { display: block; }
关于html - 下拉菜单不适用于 MasterPage,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41665997/