html 引导字体颜色未更改，导航栏按钮响应未按预期工作

xv8emn3q 于 2022-12-09 发布在其他

关注(0)|答案(2)|浏览(143)

我是一个前端新手，我的教授说也许Bootstrap是很好的练习，所以我试图编写一个非常简单的页面，但我遇到了一些问题。
这是我的代码

https://github.com/nguyencuc2586/project1

这是我的问题1的图片（抱歉，因为图片太大，所以我必须上传到这个页面）
https://imgur.com/a/osfbQl5
正如您在我的代码中所看到的，我在style.css文件中编写了以下代码

body {
background: #333;
color: #fff;
}

所以我以为所有的文字都必须是白色的？但是你可以在图片中看到，文字不都是白色的吗？
我的第二个问题是，在这张图中

右上角的图标，它不能作为响应图标工作，我的意思是当我点击它时，它没有显示任何东西。
你能给予我一些建议吗？先谢谢你。

Html

来源：https://stackoverflow.com/questions/74731951/bootstrap-font-color-does-not-change-and-the-navbar-button-responsive-does-not-w

2条答案

按热度按时间

pdtvr36n1#

jQuery应该在Popper和Bootstrap JS之前，如下所示：

<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>

此外，如果您要覆盖引导CSS，请添加!important。
如果这能解决你的问题，请告诉我。

赞(0）回复(0）举报 2022-12-09

d7v8vwbk2#

要使用CSS，必须将其保存在bootstrap链接下。要解决菜单图标不能工作的问题，还必须将JS bootstrap链接保存在jQuery和pooper下。

<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous" />
<title>Bootstrap Theme</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous" />
<link rel="stylesheet" href="css/style.css" />

和引导js

<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>

赞(0）回复(0）举报 2022-12-09

我来回答

html 引导字体颜色未更改，导航栏按钮响应未按预期工作

2条答案

相关问题

热门标签

最新问答