gpt4 book ai didi

html - Bootstrap 导航栏中的链接错误

转载 作者:太空宇宙 更新时间:2023-11-04 03:23:01 24 4
gpt4 key购买 nike

我正在尝试自学 bootstrap,但我遇到了一个奇怪的问题:我的导航栏似乎有指向不存在的内容的链接。

在导航栏上方,我有一个社交媒体联系人列表,但最后一个列表项 (instagram) 似乎在导航栏中创建了一个超链接。现在,社交媒体列表和导航栏列表位于完全独立的容器中,instagram <a>标签已关闭并且 <li><ul>标签已关闭。

当我在浏览器开发人员工具中查看时,它显示了我的 HTML 中没有的其他 Instagram 链接,所以我不知所措。我肯定错过了什么。网站是 coledavidson.ca/web(它仍在开发中,请勿判断)。

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Cole Davidson</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>

<body>
<div class="container">

<!--HEADER SECTION-->
<div id="header">
<div class="row">
<span align="center"></center><div class="col-sm-9 header-img"><div class="header-img-box"><img src="images/Cole%20Davidson%20-%20White.png"></div></div></span>
<div class="col-sm-3 social-media">
<ul>
<li><a href="mailto:coledavidson103@gmail.com"><img src="images/sm-icons/email.png"</a></li>
<li><a href="http://twitter.com/cole_davidson"><img src="images/sm-icons/twitter.png"</a></li>
<li><a href="http://facebook.com/cole.jorden.davidson"><img src="images/sm-icons/fb.png"</a></li>
<li><a href="http://linkedin.com/cole.davidson"><img src="images/sm-icons/linkedin.png"</a></li>
<li><a href="http://instagram.com/coledavidson103"><img src="images/sm-icons/instagram.png"</a></li>
</ul>
</div>
</div>
</div>

<!--NAV BAR SECTION-->
<div class="row">
<nav class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="dropdown active">
<a class="dropdown-toggle" data-toggle="dropdown" href="index.html">About
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="about/education.html">Education</a></li>
<li><a href="about/employment.html">Employment</a></li>
<li><a href="about/volunteerism">Volunteerism</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Services
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="services/graphic.html">Graphic Design</a></li>
<li><a href="services/web.html">Web Design</a></li>
<li><a href="services/nationbuilder.html">NationBuilder</a></li>
<li><a href="services/digital.html">Digital Strategy</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="portfolio/graphics.html">Graphic Design</a></li>
<li><a href="portfolio/web.html">Web Design</a></li>
</ul>
</li>
</ul>
</div>
</nav>
</div>

<!--PAGE CONTENT SECTION-->
<div class="row">
<div class="col-sm-12"><h1>Page Title goes here.</h1></div>
</div>
<div class="row">
<div class="col-sm-12"><p>Page content goes here.</p></div>
</div>

<!--FOOTER SECTION-->
<div class="row"><div class="col-sm-12"><p>Footer content goes here.</p></div>
</div>


</div>
</body>
</html>

CSS:

/*This is the stylesheet for coledavidson.ca. This website also uses the bootstrap stylesheets.*/
/*Author: Cole Davidson*/

body {
background-image: url(images/about-bg.jpg);
background-repeat:no-repeat;
background-size: auto;
background-position:center;
height: 100%;
}

.header-img img {
width: 75%;
height: auto;
}

.social-media ul {
list-style: none;
}

.social-media img {
width:30px;
height:auto;
}

提前致谢!

最佳答案

此处您在 <img src=""> 中遗漏了一个“>”标签

关于html - Bootstrap 导航栏中的链接错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27596964/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com