为了账号安全,请及时绑定邮箱和手机立即绑定

下拉菜单 aria-haspopup="true" aria-expanded="true">??

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>基本用法</title>
    <link rel="stylesheet" href="../bs-3.3.7/css/bootstrap.min.css">
    <script src="../js/jquery-2.0.0.min.js"></script>
    <script src="../bs-3.3.7/js/bootstrap.min.js"></script>
    <style type="text/css">
        ul>li{
            cursor: pointer;
        }
        .dropdown{
            margin: 10px 0 0 10px;
        }
    </style>
</head>
<body>

<div class="dropdown">
    <button class=" btn btn-default dropdown-toggle"  type="button" data-toggle="dropdown" id="dropmenu" aria-haspopup="true" aria-expanded="true">
        下拉菜单
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu" aria-labelledby="dropmenu">
        <li>苹果</li>
        <li>香蕉</li>
        <li>西瓜</li>
        <li>猕猴桃</li>
        <li>西红柿</li>
    </ul>
</div>
<script>
    (function mouse() {
        $("li").mouseenter(function () {
            $(this).css("background-color","blue").siblings().css("background-color","#fff ");
        });
        $("li").mouseleave(function () {
            $("li").css("background","white");
        })
    })();
</script>
</body>
</html>


https://img4.sycdn.imooc.com/5b545feb0001df0208640556.jpg

正在回答

1 回答

不用自己写,是bootstrap自带的,hover的时候有灰色背景

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

下拉菜单 aria-haspopup="true" aria-expanded="true">??

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信