gpt4 book ai didi

html - Bootstrap 下拉菜单未出现在 "col"内

转载 作者:行者123 更新时间:2023-11-28 00:59:12 24 4
gpt4 key购买 nike

这是我的html代码

<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="bootstrap-4.1.3-dist/css/bootstrap.min.css">

<title>Hello, world!</title>
</head>
<body>
<div class="container-fluid p-0">
<div class="col bg-primary" style="max-width: 200px;">
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Regular link</a>
<a class="dropdown-item active" href="#">Active link</a>
<a class="dropdown-item" href="#">Another link</a>
</div>
</div>
</div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="jquery-3.3.1.slim.min.js"></script>
<script src="popper.min.js"></script>
<script src="bootstrap-4.1.3-dist/js/bootstrap.min.js"></script>
</body>
</html>

而不是里面的菜单 <div class="col bg-primary" style="max-width: 200px;">我在顶部有一个蓝色的小条作为 div 大小我尝试在下拉菜单之前添加一个 clearfix 它不起作用

最佳答案

<!doctype html>
<html lang="en">

<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="bootstrap-4.1.3-dist/css/bootstrap.min.css">

<title>Hello, world!</title>
</head>

<body>
<div class="container">

<div class="row">
<div class="dropdown">
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
Dropdown button
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Regular link</a>
<a class="dropdown-item" href="#">Active link</a>
<a class="dropdown-item" href="#">Another link</a>
</div>
</div>
</div>
</div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />
</body>

</html>

您似乎缺少一些 div 和 css 类。

关于html - Bootstrap 下拉菜单未出现在 "col"内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52776655/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com