我在尝试设置mmenu时遇到了问题,我在文档中找到了一个为此指定自定义类的示例,但这不起作用。我尝试过变种:悬停在上面,但这也没有用。
以下代码
.mm-listview li span:hover {
font-size: 1em;
}

<!DOCTYPE html>
<html>
<head>
<title>Demo for Erika</title>
<!-- MMENU: START (http://mmenu.frebsite.nl/) -->
<!-- Include jQuery.mmenu .css files -->
<link type="text/css" href="../mmenu/jquery.mmenu.all.css?v=6.1.7" rel="stylesheet" />
<script type="text/javascript" src="../mmenu/jquery.mmenu.all.js"></script>
<link href="../mmenu/jquery.mmenu.css" type="text/css" rel="stylesheet" />
<link href="../mmenu/jquery.mmenu.setselected.css" type="text/css" rel="stylesheet" />
<!-- MMENU: END -->
<style type="text/css">
</style>
</head>
<body>
<!-- The page -->
<div class="page">
<div class="header">
<a href="#my-menu" class='btn btn-success'>Demo</a>
</div>
<div class="content">
<p><strong>This is a demo.</strong><br />
Click the menu icon to open the menu.</p>
</div>
</div>
<!-- The menu -->
<nav id="my-menu">
<ul>
<li>
<span> <!-- http://mmenu.frebsite.nl/support/tips-and-tricks.html See: Open Submenus -->
<h1>About us</h1>
<p>This is a text explaining how things that are below this menu item. Don't be scared to click on it.</p>
</span>
<ul>
<li><a href="#">Overview</a></li>
<li><a href="#">Contacts</a></li>
<li><a href="#">Annual Report</a></li>
</ul>
</li>
</ul>
</nav>
</body>
</html>
&#13;
任何指针?
答案 0 :(得分:0)
我不知道mmenu
是什么,但我认为:hover
css selector可能是一个答案。
用法
.active {
text-decoration: underline;
background-color: black;
}
/* Title of menu items */
.mm-listview li span h1 {
font-size: 2em;
color: blue;
}
/* Title style on mouse hover */
.mm-listview li span h1:hover {
/*css declarations;*/
}
/* Description of menu items */
.mm-listview li span p {
font-size: 1em;
}
/* item style on mouse hover */
.mm-listview li span p:hover {
/*css declarations;*/
}
答案 1 :(得分:0)
对于mmenu,因为mmenu会自动添加li的子元素以支持屏幕阅读器,所以新元素(锚)具有一个位置:绝对并且优先于所有其他具有:悬停事件的兄弟。
因此,根据这个问题,:hover必须放在父元素上,这里是li元素。
.mm-listview li:hover {
background-color:#ff6600;
}