为什么<h3>表现得像<a>

Question

我正在创建一个网站,其中我编写了一个h3的标签,但其作用类似于上面提到的页面的链接.这是代码:

<div class="bar">
  <div class="sitename">
    <h2 style="color:white">Metro City</h2>
  </div>
  <ul class="bar">
    <li class="bar"><a class="bar" href="Home.html" />Home</li>
    <li class="bar"><a class="bar" href="Search.html" />Search</li>
    <li class="bar"><a class="bar" href="Buy.html" />Buy</li>
    <li class="bar"><a class="bar" href="Sell.html" />Sell</li>
    <li class="bar"><a class="bar" href="About Us.html" />About Us</li>
    <li class="bar"><a class="bar" href="ContactUs.html" />Contact Us</li>
  </ul>
</div>





<div>
  <h3 style="color:black">Find your Home</h3>
</div>

Answer 1

因为<a>标签不是自动关闭的.基本上,您的第一个<a>标签未关闭,因此浏览器将其后的所有内容视为子元素.

您需要修改标记以正确关闭<a>元素,如下所示:

<div class="bar">
    <div class="sitename">
        <h2 style="color:white">Metro City</h2>
    </div>
    <ul class="bar">
        <li class="bar"><a class="bar" href="Home.html">Home</a></li>
        <li class="bar"><a class="bar" href="Search.html">Search</a></li>
        <li class="bar"><a class="bar" href="Buy.html">Buy</a></li>
        <li class="bar"><a class="bar" href="Sell.html">Sell</a></li>
        <li class="bar"><a class="bar" href="About Us.html">About Us</a></li>
        <li class="bar"><a class="bar" href="ContactUs.html">Contact Us</a></li>
    </ul>
</div>

<div>
    <h3 style="color:black">Find your Home</h3>
</div>