Twitter bootstrap is not working

问题

Hi my problem is that the button doesn't work, I can't find where I'm wrong. Any help? Also I'm new in Twitter Bootstrap.<button type="buttton" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

<div class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="buttton" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="#" class="navbar-brand">Mitashki</a>
        </div>

        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="#">home</a></li>
                <li><a href="#">about</a></li>  
            </ul>
        </div>
    </div>
</div>

回答1:

When you use Bootstrap , it's good if use basic template .

Basic Template

And your problem : collapse navbars in Bootstrap uses bootstrap.js . And this file based on jQuery . So in bottom of your code you must add both files .

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
</body>
</html>

回答2:

You're probably going to smack yourself for this. You should erase that extra "t" in

<button type="buttton"...

回答3:

Paspartu, the button that you are referring to is the sandwich that appears when your viewport is small enough. Try shrinking your browser until you see this.

回答4:

Buttton should be Button...

<button type="buttton" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

should be

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

Also, if your button is not responsive, then you would need to add this to your header page:

 <!-- Latest compiled and minified CSS -->
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

 <!-- jQuery library -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

 <!-- Latest compiled JavaScript -->
 <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

Add this first to your header. Your button that isn't responding needs JQUERY to work (and I took the links from W3schools for answering purposes)

来源：https://stackoverflow.com/questions/34363492/twitter-bootstrap-is-not-working