Html 导航栏下的空格
我无法删除第二个导航栏下不必要的空间。下面是该部分的html和css。我还添加了图片来显示它在这种状态下的样子。 Css部分:Html 导航栏下的空格,html,css,Html,Css,我无法删除第二个导航栏下不必要的空间。下面是该部分的html和css。我还添加了图片来显示它在这种状态下的样子。 Css部分: .navbar { margin-bottom: 0; background-color: #04476b; z-index: 9999; border: 0; padding-bottom: 0; font-size: 12px !important; line-height: 1.42857143 !impor
.navbar {
margin-bottom: 0;
background-color: #04476b;
z-index: 9999;
border: 0;
padding-bottom: 0;
font-size: 12px !important;
line-height: 1.42857143 !important;
letter-spacing: 3px;
border-radius: 0;
}
.navbar li a, .navbar .navbar-brand {
color: #fa897f !important;
}
.navbar-nav li a:hover, .navbar-nav li.active a {
color: #04476b !important;
background-color: #fff !important;
}
.navbar-default .navbar-toggle {
border-color: transparent;
color: #fff !important;
}
Html部分:
<nav class="navbar navbar-inverse" style="height: 80px; background-color: lightcoral">
<div class="container-fluid">
<div class="navbar-header">
</div>
</div>
</nav>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar2">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar2">
<ul class="nav navbar-nav">
<li><a href="#intro">Home</a></li>
<li class="active"><a href="#doctor">Doctor</a></li>
<li><a href="#doctorlist">Doctor List</a></li>
<li><a href="#appointment" onclick="document.getElementById('id03').style.display='block'" style="width:auto;">Appointment</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#logout">Logout</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<form class="navbar-form navbar-right" role="search">
<div class="form-group input-group">
<input type="text" class="form-control" placeholder="Search Doctor..">
<span class="input-group-btn">
<button class="btn btn-default" type="button">
<span class="glyphicon glyphicon-search"></span>
</button>
</span>
</div>
</form>
</ul>
</div>
</div>
<div id="id03" class="modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" action="">
<div class="modal-content animate">
<div class="imgcontainer">
<span onclick="document.getElementById('id03').style.display='none'" class="close" data-dismiss="modal"title="Close Modal">×</span>
<img src="app.png" style="height: auto" width="auto" alt="Avatar" >
</div>
<div class="container2">
<label><b>Mail ID</b></label>
<input type="text" placeholder="Enter Username" name= "mailID" id="mailID" required>
<p id="mailIdErr"></p>
<label><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="psw" id="psw" required>
<p id="pswErr"></p>
<button id ="submit" type="submit" style="height: auto" width="auto" onclick="globalAppointment()">Submit</button>
<p id="loginErr"></p>
<!--<button type="submit" style="height: auto" width="auto" onclick="document.getElementById('id02').style.display='block'
"href="#myModal1" data-toggle="modal">Make Health Card</button>-->
<br>
<button type="button" onclick="document.getElementById('id03').style.display='none'" class="cancelbtn"data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>
</nav>
&时代;
邮件ID
密码
提交
取消
它似乎是固定的!一点也不。仔细看看家,医生,注销这些部分有点向上,虽然它应该是在中间位置。这看起来不太好。我用你给我们的
css
和html
创建了一个小提琴,一点问题都没有。因此,请提供更多信息和/或创建一个虚拟的实际问题。也许问题不在导航中,但下面的事情我不明白。小提琴演奏得很完美!但当我在浏览器中运行它时,并没有得到相同的结果。