我已在以下鏈接中編寫了代碼Reza https://codepen.io/vsandeep2516/pen/XWbzPVa。問題是單擊導(dǎo)航鏈接后會出現(xiàn)白色色塊。@sanriot 請參考截圖
2 回答
呼如林
TA貢獻(xiàn)1798條經(jīng)驗 獲得超3個贊
添加以下 CSS：
.nav > li > a:focus, .nav > li > a:hover{
background: transparent !important;
}
var Deb = [];
$.noConflict();
jQuery(document).ready(function($) {
Deb.push(document.location);
});
/*add*/
.nav>li>a:focus,
.nav>li>a:hover {
background: transparent!important;
}
body {
margin: 0;
padding: 0;
font: 400 14px/24px 'Open Sans', sans-serif;
}
#header {
float: left;
width: 100%;
position: relative;
}
.head-top {
float: left;
width: 100%;
position: fixed;
background: red;
z-index: 999;
}
#nav {
padding: 0;
margin: 16px 0 0 0;
list-style: none;
}
#nav li {
display: inline-block;
float: none;
position: relative;
padding: 0 0 20px 0;
}
#nav .active {
background: transparent;
}
#nav li a {
font: 400 14px/14px 'Lato', sans-serif;
color: #000;
text-transform: uppercase;
text-decoration: none;
padding: 0 20px;
display: block;
position: relative;
z-index: 20;
}
#nav li:hover>a {
background: none;
}
#nav li ul li a:hover,
#nav li ul li:hover>a {
text-decoration: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />
<header id="header">
<section class="head-top">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="left-side">
<h1>sandeep</h1>
</div>
</div>
<div class="col-md-6">
<div class="right-side">
<nav class="navbar ">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span
class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav" id="nav">
<li class="active"><a href="#" data-tab='main'>Home</a></li>
<li><a href="#aboutus" data-tab="aboutus">About</a></li>
<li><a href="#gallery" data-tab="gallery">Gallery </a></li>
<li><a href="#career" data-tab="career">career</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
</div>
</section>
</header>
慕少森
TA貢獻(xiàn)2019條經(jīng)驗 獲得超9個贊
在最后添加這個
/* unvisited link */
a:link {
background-color: red !important;
}
/* visited link */
a:visited {
background-color: red !important;
}
/* mouse over link */
a:hover {
background-color: red !important;
}
/* selected link */
a:active {
background-color: red !important;
}
- 2 回答
- 0 關(guān)注
- 116 瀏覽
添加回答
舉報
0/150
提交
取消