Javascript Bootstrap4导航按钮_Javascript_Html_Css_Twitter Bootstrap

Javascript Bootstrap4导航按钮

javascript html css twitter-bootstrap

Javascript Bootstrap4导航按钮,javascript,html,css,twitter-bootstrap,Javascript,Html,Css,Twitter Bootstrap,导航栏在大md屏幕上工作正常。但在xs-s屏幕大小中，导航按钮不会展开。有人能帮我吗我也在HTML文件中包含了所需的脚本。我正在Node.js中使用Bootstrap4 以下是HTML代码： Ristorante Con Fusion 我们从世界上最好的菜肴中汲取灵感，创造独特的融合体验。我们的唇彩创意会让你的烹饪感觉愉悦我们的美味佳肴乌萨皮扎印度乌萨帕姆（煎饼）和意大利比萨的独特组合，顶部有樱桃橄榄、成熟葡萄藤樱桃西红柿、维达利亚洋葱、甘特辣椒和水牛肉饼本月

导航栏在大md屏幕上工作正常。但在xs-s屏幕大小中，导航按钮不会展开。有人能帮我吗

我也在HTML文件中包含了所需的脚本。我正在Node.js中使用Bootstrap4 以下是HTML代码：

Ristorante Con Fusion








我们从世界上最好的菜肴中汲取灵感，创造独特的融合体验。我们的唇彩创意会让你的烹饪感觉愉悦
我们的美味佳肴
乌萨皮扎
印度乌萨帕姆（煎饼）和意大利比萨的独特组合，顶部有樱桃橄榄、成熟葡萄藤樱桃西红柿、维达利亚洋葱、甘特辣椒和水牛肉饼
本月的促销活动
周末大自助餐
以令人垂涎欲滴的组合为特色，可选择五种不同的沙拉、六种诱人的开胃菜、六种主菜和五种精选甜点。自由流动的泡沫饮料和软饮料。每人只需19.99美元
见见我们的烹饪专家
阿尔贝托·索马亚
行政总厨
屡获殊荣的米其林三星级厨师，具有广泛的国际经验。他与烹饪界的who密切合作，擅长创造令人垂涎的印度-意大利融合体验
链接






我们的地址












©版权所有2018 Ristorante Con Fusion

看来您需要从正确的目录中使用popper

使用：

“/dist/umd/popper.min.js”而不是“/dist/popper.min.js/”

似乎您需要从正确的目录使用popper

使用：

“/dist/umd/popper.min.js”而不是“/dist/popper.min.js/”

，正如@arkhz所说，问题可能是使用了不正确目录中的popper。将底部的popper导入替换为此

<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>

如果这不起作用，请尝试粘贴下面的代码，它可能会起作用

<nav class="navbar navbar-dark navbar-expand-sm fixed-top">
    <div class="container">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#Navbar">
            <span class="navbar-toggler-icon"></span>
        </button>
        <a class="navbar-brand mr-auto" href="#">Ristorante Con Fusion</a>
        <div class="collapse navbar-collapse" id="Navbar">
            <ul class="navbar-nav mr-auto ml-3">
                <li class="nav-item active">
                    <a class="nav-link" href="#">
                        <i class="fa fa-home"></i> Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="aboutus.html">
                        <i class="fa fa-info"></i> About</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">
                        <i class="fa fa-list"></i> Menu</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="contactus.html">
                        <i class="fa fa-address-card"></i> Contact</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<header class="jumbotron">
    <div class="container">
        <div class="row row-header">
            <div class="col-12 col-sm-6">
                <h1>Ristorante con Fusion</h1>
                <p>We take inspiration from the World's best cuisines, and create a unique fusion experience. Our lipsmacking
                    creations will tickle your culinary senses!</p>
            </div>
            <div>
            </div>
        </div>
    </div>
</header>

<div class="container">
    <div class="row row-content align-items-center">
        <div class="col=12 col-sm-4 col-md-3">
            <h3>Our Lipsmacking Culinary Creations</h3>
        </div>
        <div class="col col-sm col-md">
            <h2>Uthappizza</h2>
            <p>A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine
                cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.</p>
        </div>
    </div>


    <div class="row row-content align-items-center">
        <div class="col=12 col-sm-4 col-md-3 order-sm-last">
            <h3>This Month's Promotions</h3>
        </div>
        <div class="col col-sm col-md order-sm-first">
            <h2>Weekend Grand Buffet</h2>
            <p>Featuring mouthwatering combinations with a choice of five different salads, six enticing appetizers, six
                main entrees and five choicest desserts. Free flowing bubbly and soft drinks. All for just $19.99 per
                person </p>
        </div>
    </div>

    <div class="row row-content align-items-center">
        <div class="col-12 col-sm-4 col-md-3">
            <h3>Meet our Culinary Specialists</h3>
        </div>
        <div class="col col-sm col-md">
            <h2>Alberto Somayya</h2>
            <h4>Executive Chef</h4>
            <p>Award winning three-star Michelin chef with wide International experience having worked closely with whos-who
                in the culinary world, he specializes in creating mouthwatering Indo-Italian fusion experiences. </p>
        </div>
    </div>
</div>

<footer class="footer">
    <div class="container">
        <div class="row">
            <div class="col-4 offset-1 col-sm-2">
                <h5>Links</h5>
                <ul class="list-unstyled">
                    <li>
                        <a href="#">Home</a>
                    </li>
                    <li>
                        <a href="aboutus.html">About</a>
                    </li>
                    <li>
                        <a href="#">Menu</a>
                    </li>
                    <li>
                        <a href="contactus.html">Contact</a>
                    </li>
                </ul>
            </div>
            <div class="col-7 col-sm-4">
                <h5>Our Address</h5>
                <address>
                    121, Clear Water Bay Road
                    <br> Clear Water Bay, Kowloon
                    <br> HONG KONG
                    <br> <i class="fa fa-phone fa-lg"></i>: +852 1234 5678
                    <br> <i class="fa fa-fax fa-lg"></i>: +852 8765 4321
                    <br> <i class="fa fa-envelope fa-lg"></i>
                    <a href="mailto:confusion@food.net">confusion@food.net</a>
                </address>
            </div>
            <div class="col col-sm-4 align-self-center">
                <div class="text-center">
                    <a class="btn btn-social-icon btn-google" href="http://google.com/+"><i class="fa fa-google-plus"></i></a>
                    <a class="btn btn-social-icon btn-facebook" href="http://www.facebook.com/profile.php?id="><i class="fa fa-facebook"></i></a>
                    <a class="btn btn-social-icon btn-linkedin" href="http://www.linkedin.com/in/"><i class="fa fa-linkedin"></i></a>
                    <a class="btn btn-social-icon btn-twitter" href="http://twitter.com/"><i class="fa fa-twitter"></i></a>
                    <a class="btn btn-social-icon btn-google" href="http://youtube.com/"><i class="fa fa-youtube"></i></a>
                    <a class="btn btn-social-icon bg-light" href="mailto:"><i class="fa fa-envelope-o"></i></a>
                </div>
            </div>
        </div>
        <div class="row justify-content-center">
            <div class="col-auto">
                <p>&copy; Copyright 2018 Ristorante Con Fusion</p>
            </div>
        </div>
    </div>
</footer>












Ristorante con Fusion
我们从世界上最好的菜肴中汲取灵感，创造独特的融合体验。我们的唇语
创意会让你的烹饪感官发痒
我们的美味佳肴
乌萨皮扎
印度乌萨帕姆（煎饼）和意大利比萨的独特组合，上面覆盖着樱桃橄榄、成熟的葡萄藤
樱桃番茄、维达利亚洋葱、甘特辣椒和水牛肉
本月的促销活动
周末大自助餐
以令人垂涎欲滴的组合为特色，可选择五种不同的沙拉、六种诱人的开胃菜、六种
主菜和五道精选甜点。自由流动的泡沫饮料和软饮料。全部价格仅为19.99美元/天
人
见见我们的烹饪专家
阿尔贝托·索马亚
行政总厨
获奖的米其林三星级厨师，具有广泛的国际经验，曾与who密切合作
在烹饪界，他擅长创造令人垂涎的印度-意大利融合体验
链接










我们的地址
<nav class="navbar navbar-dark navbar-expand-sm fixed-top">
    <div class="container">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#Navbar">
            <span class="navbar-toggler-icon"></span>
        </button>
        <a class="navbar-brand mr-auto" href="#">Ristorante Con Fusion</a>
        <div class="collapse navbar-collapse" id="Navbar">
            <ul class="navbar-nav mr-auto ml-3">
                <li class="nav-item active">
                    <a class="nav-link" href="#">
                        <i class="fa fa-home"></i> Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="aboutus.html">
                        <i class="fa fa-info"></i> About</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">
                        <i class="fa fa-list"></i> Menu</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="contactus.html">
                        <i class="fa fa-address-card"></i> Contact</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

<header class="jumbotron">
    <div class="container">
        <div class="row row-header">
            <div class="col-12 col-sm-6">
                <h1>Ristorante con Fusion</h1>
                <p>We take inspiration from the World's best cuisines, and create a unique fusion experience. Our lipsmacking
                    creations will tickle your culinary senses!</p>
            </div>
            <div>
            </div>
        </div>
    </div>
</header>

<div class="container">
    <div class="row row-content align-items-center">
        <div class="col=12 col-sm-4 col-md-3">
            <h3>Our Lipsmacking Culinary Creations</h3>
        </div>
        <div class="col col-sm col-md">
            <h2>Uthappizza</h2>
            <p>A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine
                cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.</p>
        </div>
    </div>


    <div class="row row-content align-items-center">
        <div class="col=12 col-sm-4 col-md-3 order-sm-last">
            <h3>This Month's Promotions</h3>
        </div>
        <div class="col col-sm col-md order-sm-first">
            <h2>Weekend Grand Buffet</h2>
            <p>Featuring mouthwatering combinations with a choice of five different salads, six enticing appetizers, six
                main entrees and five choicest desserts. Free flowing bubbly and soft drinks. All for just $19.99 per
                person </p>
        </div>
    </div>

    <div class="row row-content align-items-center">
        <div class="col-12 col-sm-4 col-md-3">
            <h3>Meet our Culinary Specialists</h3>
        </div>
        <div class="col col-sm col-md">
            <h2>Alberto Somayya</h2>
            <h4>Executive Chef</h4>
            <p>Award winning three-star Michelin chef with wide International experience having worked closely with whos-who
                in the culinary world, he specializes in creating mouthwatering Indo-Italian fusion experiences. </p>
        </div>
    </div>
</div>

<footer class="footer">
    <div class="container">
        <div class="row">
            <div class="col-4 offset-1 col-sm-2">
                <h5>Links</h5>
                <ul class="list-unstyled">
                    <li>
                        <a href="#">Home</a>
                    </li>
                    <li>
                        <a href="aboutus.html">About</a>
                    </li>
                    <li>
                        <a href="#">Menu</a>
                    </li>
                    <li>
                        <a href="contactus.html">Contact</a>
                    </li>
                </ul>
            </div>
            <div class="col-7 col-sm-4">
                <h5>Our Address</h5>
                <address>
                    121, Clear Water Bay Road
                    <br> Clear Water Bay, Kowloon
                    <br> HONG KONG
                    <br> <i class="fa fa-phone fa-lg"></i>: +852 1234 5678
                    <br> <i class="fa fa-fax fa-lg"></i>: +852 8765 4321
                    <br> <i class="fa fa-envelope fa-lg"></i>
                    <a href="mailto:confusion@food.net">confusion@food.net</a>
                </address>
            </div>
            <div class="col col-sm-4 align-self-center">
                <div class="text-center">
                    <a class="btn btn-social-icon btn-google" href="http://google.com/+"><i class="fa fa-google-plus"></i></a>
                    <a class="btn btn-social-icon btn-facebook" href="http://www.facebook.com/profile.php?id="><i class="fa fa-facebook"></i></a>
                    <a class="btn btn-social-icon btn-linkedin" href="http://www.linkedin.com/in/"><i class="fa fa-linkedin"></i></a>
                    <a class="btn btn-social-icon btn-twitter" href="http://twitter.com/"><i class="fa fa-twitter"></i></a>
                    <a class="btn btn-social-icon btn-google" href="http://youtube.com/"><i class="fa fa-youtube"></i></a>
                    <a class="btn btn-social-icon bg-light" href="mailto:"><i class="fa fa-envelope-o"></i></a>
                </div>
            </div>
        </div>
        <div class="row justify-content-center">
            <div class="col-auto">
                <p>&copy; Copyright 2018 Ristorante Con Fusion</p>
            </div>
        </div>
    </div>
</footer>