html - <a href> 在整个页面上而不是在 <nav> 内-6ren

html - 在整个页面上而不是在
内

转载作者：行者123 更新时间：2023-11-28 00:50:46

我尝试制作带有 4 个链接的菜单，但可以在整个页面的任何位置单击其中一个。我试着寻找未封闭的标签，但似乎找不到任何东西。我还尝试使用检查代码错误的网站，他们说有未关闭的标签，但要么我是盲人，要么没有未关闭的标签...:/我知道这是菜鸟问题，但我现在正在尝试 20 分钟来找到未关闭的标签？我找不到。

编辑:如果我单击页面上的任意位置，about.html 将打开

我不知道如何上传文件，所以我只是在下面粘贴代码(我也有一些 css 代码，但我不认为 CSS 是问题所在):

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="utf-8" />
    <meta name="description" content="opis strony" />
    <link href="https://fonts.googleapis.com/css?family=Patrick+Hand&amp;subset=latin-ext" rel="stylesheet">
    <link rel="stylesheet" href="Style.css">
    <title> Kurs HTML i CSS3</title>
</head>

<body>
  <div class="container">
      <header>
        <div class="title">
          <h1>Kurs HTML5 i CSS3</h1>
        </div>
        <nav>
            <ul>
              <li><a href="index.html">Start</li>
              <li><a href="html5.html">HTML5</li>
              <li><a href="css3.html">CSS3</li>
              <li><a href="about.html">O mnie</li>
            </ul>
        </nav>
      </header>

      <div class="content">
          <div class="main-content">
                <section>
                    <article id="html5">
                      <h2>Artykuł o HTML5</h2>
                      <figure>
                          <img src="html5.png">
                          <figcaption>Logo HTML5</figcaption>
                      </figure>
                      <p>Witaj na mojej stronie poświęconej HTML5 i CSS3</p>
                    </article>

                    <article id="css3">
                      <h2>Artykuł o CSS3</h2>
                      <figure>
                        <img src="css3.png">
                        <figcaption>Logo CSS3</figcaption>
                      </figure>
                      <p>
                        Przykładowa treść 1 <br>
                        Przykładowa treść 2
                      </p>
                    </article>
                </section>
            </div>


            <div class="sidebar">
                <aside>
                    <h2>JavaScript</h2>
                    <p>Warto wiedzieć, że do tworzenia stron internetowych często wykorzystuje się również język JavaScript.
                      Pozwala on na zaprojektowanie interaktywnych stron internetowych poprzez reagowanie na zdarzenia.</p>
                </aside>
            </div>
        </div>


        <footer>Wszelkie prawa zastrzeżone &copy</footer>
  </div>
</body>

最佳答案

问题出在这里:

    <nav>
        <ul>
          <li><a href="index.html">Start</li>
          <li><a href="html5.html">HTML5</li>
          <li><a href="css3.html">CSS3</li>
          <li><a href="about.html">O mnie</li>
        </ul>
    </nav>

您应该以这种方式关闭链接文本之后的元素:

    <nav>
        <ul>
          <li><a href="index.html">Start</a></li>
          <li><a href="html5.html">HTML5</a></li>
          <li><a href="css3.html">CSS3</a></li>
          <li><a href="about.html">O mnie</a></li>
        </ul>
    </nav>

如果你不关闭它，a 元素之后的所有内容都在 anchor 元素“内部”