使用Bower安装的引导程序时导航栏无法正确显示

时间:2019-11-08 10:08:17

标签: css twitter-bootstrap

使用Bower软件包管理器安装的引导程序时,导航栏无法正常工作。

导航栏下方列表中的文章由引导程序设置样式也不错。最后,我将链接更改为引导CSS,然后正确设置了导航栏的样式。有人知道为什么吗?

<!DOCTYPE html>
<html>

<head>
    <title>Articles</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"> // works
    // <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"> // not working for navbar
</head>

<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="navbar-header"><a class="navbar-brand" href="#">WebSiteName</a></div>
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">Home</a></li>
                <li><a href="#">Page 1</a></li>
                <li><a href="#">Page 2</a></li>
                <li><a href="#">Page 3</a></li>
            </ul>
        </div>
    </nav>
    <div class="container">
        <h1>Articles</h1>
        <ul class="list-group">
            <li class="list-group-item">Article One</li>
            <li class="list-group-item">Article Two</li>
            <li class="list-group-item">Article Three</li>
            <li class="list-group-item">MyTitle</li>
        </ul>
        <br>
        <hr>
        <footer>
            <p>Copyright &copy; 2019</p>
        </footer>
    </div>
</body>

</html>

2 个答案:

答案 0 :(得分:1)

尝试添加bootstrap.min.css而不是bootstrap.css

 matplotlib.rcParams['text.usetex'] = True

答案 1 :(得分:1)

“ bower_components / bootstrap / dist / css / bootstrap.css” 看起来他们从bower_components \ bootstrap \ bower.json

中删除了“ dist / css / bootstrap.css”

我们通过覆盖项目bower.json临时修复了此问题。对我们来说,它工作正常。但是正在等待引导程序的解决方案。

"overrides":{
    "bootstrap" : {
         "main": [
            "less/bootstrap.less",
            "dist/css/bootstrap.css",
            "dist/js/bootstrap.js"
          ]
    }
}