我想创建子菜单，我唯一的问题是子菜单必须在主菜单下面，而不是每个主菜单里。像这样
这是我的代码:
<div id="menu_controller">
<ul class="menu">
<li> </li>
<li >
<a href="#">
کدهای تبلیغاتی
</a>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
<li> </li>
<li >
<a href="#">
فروشگاه
</a>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
<li> </li>
<li>
<a href="#">
گزارشات
</a>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
<li> </li>
<li>
<a href="#">
محصولات
</a>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
<li> </li>
<li>
<a href="#">
امور مال
</a>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
<li> </li>
<li>
<a href="#">
پیام ها
</a>
<div></div>
<span> </span>
<ul >
<li><a href="#">کل سفارش</a></li>
<li><a href="#">سفارش معلق</a></li>
<li><a href="#">سفارش آماده به ارسال</a></li>
<li><a href="#">سفارش ارسال شده</a></li>
<li><a href="#">سفارش توزیع شده</a></li>
<li><a href="#">سفارش وصول شده</a></li>
<li><a href="#">سفار برگشتی</a></li>
</ul>
</li>
</ul>
</div>
和我的 CSS 代码:
#menu_controller
{
width:1000px;
margin:0 auto;
border:1px solid red;
}
ul.menu
{
overflow:hidden;
}
ul.menu li
{
float:right;
}
ul.menu li:hover {position: absolute;}
ul.menu li:hover ul{display:block; position: absolute;}
ul.menu li:hover li
{
display:block;
position: relative;
overflow:hidden;
}
ul.menu li ul
{
display: none;
}
最佳答案
通过一些改变，我可以通过一些改变来实现这一点。
.menu{
list-style: none; overflow:hidden;
}
ul.menu li{
float:left;
display:block;
}
您可以在 this fiddle 查看此工作情况
关于javascript - 我如何选择当前的 li 元素 div 标签，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20515350/