按钮标签重定向到 link 仅用于按钮

Question

我正在尝试制作这个网站，您可以在其中下载我制作的一些代码，但我在 HTML 和 CSS 方面并不是很擅长。很抱歉，如果我做了一些非常引人注目的事情。

无论如何，这是我的代码：

<!DOCTYPE html>
<html>
    <head>
        <title>Downloads</title>
        <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
        <link rel="stylesheet" href="css.css"> 
    </head>

<body>
    <div class="w3-bar darktheme">
        <a href="/" class="w3-bar-item w3-button w3-mobile"><img src="img/logo.png" alt="CodeDownloads"></a>
        <a href="windows.html" class="w3-bar-item w3-button w3-mobile">My Main Projects</a>
        <a href="linux.html" class="w3-bar-item w3-button w3-mobile">Other</a>
        <a href="software.html" class="w3-bar-item w3-button w3-mobile">Compiled</a>
        <a href="about.html" class="w3-bar-item w3-button w3-mobile">About</a>
    </div>
    <br>
    <label class=white>Title 1</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 2</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 3</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 4</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 5</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 6</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 7</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 8</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 9</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 10</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
   <br>
   <br>
    <label class=white>Title 11</label>
    <a href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">
   <button class=button>Download</button>
</a>
</body>
</html>

标签（例如 <label class=white>Title 10</label>）也会重定向。我根本不想这样。我只希望它是普通文本。如果我尝试使用段落标签，它会显示在按钮上方，这可能会让某些人感到困惑。

谢谢

Answer 1

你的结构必须是这样的：

  <label class="white">Title 11</label>
  <a class="button" href="https://drive.google.com/file/d/1GO9wvJV7oJViSou8yVCaSsNqWAsf7FxM/view?usp=sharing">Download</a>

您必须关闭 'a' 标签并记住类必须用引号引起来

Answer 2

您需要在按钮后添加一个结束锚标记。例如：

<label class=white>Title 1</label>
  <a href="https://drive.google.com...">
    <button class=button>Download</button>
  </a> <-- closing anchor tag

按钮标签重定向到 link 仅用于按钮

Labels for buttons redirect to link meant for only the button

html

css

w3.css