在 C# 中用 javascript 覆盖菜单 css
本文关键字:菜单 css 覆盖 javascript 中用 | 更新日期: 2023-09-27 18:32:23
我正在使用C#创建一个网站,供驾驶者使用智能手机支付停车费。但是,我的菜单遇到了一些问题。我希望菜单是白色的,带有黑色文本,当前页面需要是蓝色的,带有白色文本,但是当我尝试使用 css 这样做时,我得到了完全不同的东西:当前页面菜单项仍然是白色的黑色文本,在它后面你会看到一点蓝色。有人知道我该如何解决这个问题吗?
我的菜单项位于母版页中:
<div id="menu">
<ul>
<li id="accountmenu"><a href="PersoonlijkeGegevens.aspx">Mijn account</a></li>
<li id="parkeermenu"><a href="Parkeer.aspx">Parkeer</a></li>
<li id="saldomenu"><a href="SaldoGegevens.aspx">Mijn saldo</a></li>
</ul>
</div>
我在每个页面中添加带有JavaScript的当前页面类:
<script type="text/javascript">
$(document).ready(function () {
$("#saldomenu").addClass("currentpage");
});
</script>
最后,我将css设置为母版页的css文件中
#menu ul li a:link, a:visited
{
background:#fff;
display:inline-block;
padding:5px 10px 6px;
color:#000;
font-size:16px;
text-decoration:none;
-moz-border-radius:6px;
-webkit-border-radius:6px;
-moz-box-shadow:0 1px 3px rgba(0,0,0,0.6);
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.6);
border-bottom:1px solid rgba(0,0,0,0.25);
position:relative;
cursor:pointer;
}
.currentpage
{
background:#172c7d;
color:#fff;
}
我真的不知道我在这里做错了什么,我已经在寻找 2 周的正确答案了。可以请有人帮我解决这个问题。
您需要使当前页面类更具体。您当前的页面类仅影响 li 元素,而不影响链接。
#menu ul li.currentpage a:link, #menu ul li.currentpage a:visited
{
background:#172c7d;
color:#fff;
}