Html 主动<;导航>;页面加载时未显示项目
我似乎无法让默认的Html 主动<;导航>;页面加载时未显示项目,html,bootstrap-4,nav,Html,Bootstrap 4,Nav,我似乎无法让默认的元素显示在Bootstrap-4导航菜单中 我既有Bootstrap css引用,也有对nodejquery.min.js和Bootstrap.min.js的引用 这个例子:非常好用。这就是我得到这个例子的地方 <head> <title>KR-DevTools</title> <meta charset="utf-8"> <meta name="viewport" content="width=de
元素显示在Bootstrap-4导航菜单中
我既有Bootstrap css引用,也有对nodejquery.min.js
和Bootstrap.min.js
的引用
这个例子:非常好用。这就是我得到这个例子的地方
<head>
<title>KR-DevTools</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
</head>
<body>
<p></p>
<div class='container border shadow'>
<div class=""><h1>KR-DevTools</h1></div>
</div>
<p></p>
<div class='container border border-top-0 shadow'>
<ul class="nav nav-tabs bordered">
<li class="nav-item active"><a class="nav-link" data-toggle="tab" href="#home">Session Variables</a></li>
<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#menu1">Menu 1</a></li>
<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#menu2">Menu 2</a></li>
<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#menu3">Menu 3</a></li>
</ul>
<div class="tab-content">
<div id="home" class="tab-pane fade in active">
<h3>Menu 1</h3>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div id="menu1" class="tab-pane fade">
<h3>Menu 1</h3>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div id="menu2" class="tab-pane fade">
<h3>Menu 2</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
</div>
<div id="menu3" class="tab-pane fade">
<h3>Menu 3</h3>
<p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
</div>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
KR开发工具
KR开发工具
菜单1
但是,在最低限度上,我们需要一个实验室来进行日常工作
菜单1
但是,在最低限度上,我们需要一个实验室来进行日常工作
菜单2
在所有人都有错误的情况下,我们必须清楚地看到,所有的人都有错误
菜单3
发明者的真实性和准建筑师必须解释清楚
第一个list item元素调用正确的Bootstrap-4类afaik,即
。第一项本应在页面加载时显示,但实际上没有显示。两件事:
您的代码中有
。相反,您应该在链接本身上创建活动类:
其次,将
更改为
进行这些更改会得到您想要的结果。两件事: 您的代码中有
。相反,您应该在链接本身上创建活动类:
其次,将
更改为
进行这些更改应该会得到您想要的结果。您可以在此处查看,以便更容易理解我的意思。您可以在此处查看,以便更容易理解我的意思。嘿@Frank Doe,谢谢您的帮助!这一点非常有效,关键在于
。非常感谢!伟大的那么你能接受这个答案吗?谢谢似乎还没有足够的声望点。当我这么做的时候,我会回来接受你的回答(如果他们允许的话)。嘿@Frank Doe,谢谢你的帮助!这一点非常有效,关键在于
。非常感谢!伟大的那么你能接受这个答案吗?谢谢似乎还没有足够的声望点。当我这样做的时候,我会回来接受你的回答(如果他们允许的话)。