<ul class="nav nav-tabs"> ... <li role="presentation" class="dropdown"> <a class="dropdown-toggle " data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> Dropdown<span class="caret"></span> </a> <ul class="dropdown-menu"> ... </ul...
<div class="input-group mt-3 mb-3"> <button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown"> 选择网站 </button> <ul class="dropdown-menu"> <li><a class="dropdown-item" href="https://www.google.com">GOOGLE</a></li> <li><a class="dropdown...
3 引入JQuery、Bootstrap等插件，这里以CDN方式引入。4 下拉菜单代码：<div class="dropdown"><button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">书本<span class="caret"></span></button><ul class="dropdown-menu" role...
ul元素包含class="dropdown-menu",用于设置下拉菜单的样式和行为。属性aria-labelledby="dropdownMenuButton"告诉Bootstrap 5使用与按钮关联的文本作为下拉菜单的标签。 在ul元素中,我们包含了三个li元素,每个元素均包含一个a元素,用于表示下拉菜单中的选项。class="dropdown-item"类用于指示这些a元素是下拉菜单的选项...
group"><button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown">Sony</button><ul class="dropdown-menu"><li><a class="dropdown-item" href="#">Tablet</a></li><li><a class="dropdown-item" href="#">Smartphone</a></li></ul></div></div></...
<liclass="offset-left dropdown"> 2 <ahref="#"class="dropdown-toggle">Dropdown...</a> 3 <ulclass="dropdown-menu"> 4 <li><ahref="#">Secondary link</a></li> 5 <li><ahref="#">Something else here</a></li> 6 <li><ahref="#">Something else here</a></li> ...
</ul> 如果需要在菜单项中添加下拉菜单,可以在菜单项中再添加一个无序列表,并添加dropdown-menu类。 代码语言:txt 复制 <ul class="navbar-nav"> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown"...
•.dropdown-item-text类可以设置下拉菜单中的文本项•<ulclass="dropdown-menu">•<li><aclass="dropdown-item"href="#">链接1</a></li>•<li><aclass="dropdown-item"href="#">链接2</a></li>•<li><aclass="dropdown-item"href="#">链接3</a></li>•<li><aclass="drop...
group"> <button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown">Sony</button> <ul class="dropdown-menu"> <li><a class="dropdown-item" href="#">Tablet</a></li> <li><a class="dropdown-item" href="#">Smartphone</a></li> </ul> </div> <...
创建导航菜单:使用Bootstrap提供的CSS类和组件创建导航菜单。可以使用<nav>元素和<ul>、<li>元素来定义菜单的结构。 添加响应式样式:使用Bootstrap的CSS类来定义菜单在不同屏幕宽度下的样式。可以使用navbar类和navbar-expand-*类来实现菜单的折叠和展开。