我正在尝试使用 HTML , CSS 和 JavaScript 做 Facebook 的模拟页面作为我的第一个项目STRONG>。出于某种原因,当我尝试使用<h1>
标记制作标题时,它会作为链接出现。我不希望这样,只是一个常规标题会很好。我似乎无法弄清楚我做错了什么。我已经被困了很长一段时间,我甚至不得不删除我之前的一些代码来解决它。目前,我有一个index.html页面,一个main.css页面和一个reset.css页面。
HTML
<!DOCTYPE html>
<html>
<head>
<title>Social Media Clone</title>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<link href="css/reset.css" rel="stylesheet">
<link href="css/main.css" rel="stylesheet">
</head>
<body>
<header>
<div class="logo-area">
<a href="index.html">Logo</a>
</div>
<div class="menu">
<ul>
<li>
<a href="chloe.html"</a>Chris
</li>
<li>
<a href="example.html"</a>Home
</li>
</ul>
</div>
<div class="icon-links">
<ul class="quick-options">
<li>
<a href="chloe.html"</a><i class="fa fa-users" aria-hidden="true"></i>
</li>
<li>
<a href="chloe.html"</a><i class="fa fa-commenting" aria-hidden="true"></i>
</li>
<li>
<a href="chloe.html"</a><i class="fa fa-bell" aria-hidden="true"></i>
</li>
</ul>
<div class="privacy">
<i class="fa fa-lock" aria-hidden="true"></i>
</div>
</div>
<div class="search-area">
<ul>
<li>
<i class="fa fa-search" aria-hidden="true"></i>
</li>
<li>
<input type="text" name="search">
</li>
<li>
<i class="fa fa-times" aria-hidden="true"></i>
</li>
</ul>
</div>
</header>
<h1>Chris</h1>
</body>
</html>`
答案 0 :(得分:2)
正如上面的Henry7720所述,只需关闭a
标签即可。这适用于JSFiddle:
<!DOCTYPE html>
<html>
<head>
<title>Social Media Clone</title>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<link href="css/reset.css" rel="stylesheet">
<link href="css/main.css" rel="stylesheet">
</head>
<body>
<header>
<div class="logo-area">
<a href="index.html">Logo</a>
</div>
<div class="menu">
<ul>
<li>
<a href="chloe.html"></a>Chris
</li>
<li>
<a href="example.html"></a>Home
</li>
</ul>
</div>
<div class="icon-links">
<ul class="quick-options">
<li>
<a href="chloe.html"></a><i class="fa fa-users" aria-hidden="true"></i>
</li>
<li>
<a href="chloe.html"></a><i class="fa fa-commenting" aria-hidden="true"></i>
</li>
<li>
<a href="chloe.html"></a><i class="fa fa-bell" aria-hidden="true"></i>
</li>
</ul>
<div class="privacy">
<i class="fa fa-lock" aria-hidden="true"></i>
</div>
</div>
<div class="search-area">
<ul>
<li>
<i class="fa fa-search" aria-hidden="true"></i>
</li>
<li>
<input type="text" name="search">
</li>
<li>
<i class="fa fa-times" aria-hidden="true"></i>
</li>
</ul>
</div>
</header>
<h1>Chris</h1>
</body>
</html>