个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
24
4
我正在为我学校的赛艇队制作一个网站，我似乎无法使导航栏中的链接正常工作。我试过切换 <p>和 <a>标记并更改 z-index的元素。
HTML:
<body>
<header class="horizontalDiv">
<img src="http://www.computer-wallpaper-backgrounds.com/wallpaper/1680x1050/cool-backgrounds/water-ripples-background.jpg" id="headerPic"/>
<div id="titleContainer">
<b><p id="title">*** Crew Team</p></b>
</div>
<div class="horizontalDiv" id="navigation">
<div class="nav" id="home">
<p><a href="https://www.google.com/?gws_rd=ssl">Home</a></p>
</div>
<div class="nav" id="rowingSeason">
<a><p>Rowing Season</p></a>
</div>
<div class="nav" id="basicsOfCrew">
<a><p>Basics of Crew</p></a>
</div>
<div class="nav" id="registration">
<a><p>Registration</p></a>
</div>
<div class="nav" id="documents">
<a><p>Documents</p></a>
</div>
<div class="nav" id="pictures">
<a><p>Pictures</p></a>
</div>
<div class="nav" id="news">
<a><p>News</p></a>
</div>
<div class="nav" id="boosters">
<a><p>Boosters</p></a>
</div>
</div>
</header>
</body>
CSS:
.horizontalDiv {
width: 104%;
}
header {
height: 200px;
border-bottom: 3.5px solid black;
margin: -10px 0px 0px -10px;
}
#headerPic {
width: 100%;
height: 100%;
z-index: 1;
opacity: .5;
}
#title {
color: #b91a2f;
font-size: 30px;
font-family: verdana;
}
#titleContainer {
z-index: 100;
margin-top: -170px;
margin-left: 65px;
}
.nav {
z-index: 99;
height: 100%;
width: 11.3%;
margin: 15px 0px 0px -3px;
display: inline-block;
border-left: 3px solid black;
border-right: 3px solid black;
}
.nav p {
text-align: center;
font-family: verdana;
font-size: 16px;
color: black;
}
我现在刚刚获得了转到谷歌的链接。
最佳答案
问题在于您创建这些链接的方式。
他们肯定不会工作，因为您还没有指定他们应该链接到哪里。
错误:
<div class="nav" id="basicsOfCrew">
<a>Basics of Crew</a>
</div>
正确:
<div class="nav" id="basicsOfCrew">
<a href="#" title="">Basics of Crew</a>
</div>
关于html - 为什么 <a> 标签不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26833959/
24
4
0
我是一名优秀的程序员,十分优秀！