0
私はBootsrapで遊んでいます。そして、ここに私のhtmlはブートストラップnavbar-fixed-topはクリックで開くことはありません
</!DOCTYPE html>
<html>
<head>
<title>JQuery</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="jquery.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Droid+Serif|Montserrat' rel='stylesheet' type='text/css'>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#" id="logo">MyPortfolio</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right" id="menu">
<li class="active text-uppercase"><a href="#">services</a></li>
<li class="text-uppercase"><a href="#">portfolio</a></li>
<li class="text-uppercase"><a href="#">about</a></li>
<li class="text-uppercase"><a href="#">team</a></li>
<li class="text-uppercase"><a href="#">contact</a></li>
</ul>
</div>
</div>
</nav>
<div id="top">
<div class="container">
<div class="row">
<div class="col-xs-12 intro-pre-heading">Welcome To My Website!</div>
</div>
<div class="row">
<div class="col-xs-12 intro-heading">it's nice to meet you</div>
</div>
<div class="row">
<div class="col-xs-12 text-center"><a href="#" class="btn btn-lg btn-warning">TELL ME MORE</a></div>
</div>
</div>
</div>
</body>
</html>
とCSSです：
*{
color: white;
font-family: 'Montserrat', sans-serif;
}
#logo{
color:#FED136;
font-family: "Kaushan Script","Helvetica Neue",Helvetica,Arial,cursive;
font-size: 2em;
margin: 10px 5px 10px 30px;
}
#menu{
margin: 10px 30px 10px 0;
}
#menu li{
margin:0 15px;
}
div#top{
margin-top: 70px;
background-color: black;
background: url('http://blackrockdigital.github.io/startbootstrap-agency/img/header-bg.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: 100% 100%;
height: 600px;
}
.intro-heading{
font-family: 'Montserrat', sans-serif;
text-transform: uppercase;
text-align: center;
font-weight: bold;
font-size: 70px;
}
.intro-pre-heading{
margin-top: 110px;
font-family: 'Droid Serif', serif;
font-style: italic;
text-align: center;
font-size: 40px;
}
.btn-warning {
font-size:40px!important;
margin-top: 60px;
background-color: #FED136 !important;
border-background:#FED136;
}
しかし、ナビゲーションバーのトグルボタンは開きません。私はコードの何が間違っているのか分かりません。私はここで同様の質問を見て、さまざまなアプローチを試しましたが、誰も私の問題を解決しませんでした
それは働きます！ありがとうございました！ – kurumkan