在一個錨標記內包裹 div 是否是有效的程式碼?


是的,根據 HTML5 規範,我們可以將 div 放置在錨標記中,例如 −

<a href="#" target="_blank">
   <div class="demo"></div>
</a>

另一個示例 −

<a href= www.tutorialspoint.com>
   <div> this now becomes a link </div>
</a>

HTML5 允許將 <a> 標記包裝在 <div> 元素中。因此,<div> 將顯示在 <anchor> 標記內。

示例

讓我們看一個 <anchor> 標記中的 div 示例 −

<!DOCTYPE html>
<html>
<head>
   <style>
      .container {
         position: relative;
         background-color: orange;
         width: 200px;
         height: 200px;
      }
      .container a {
         position: absolute;
         top: 0;
         bottom: 0;
         left: 0;
         right: 0;
         z-index: 999;
      }
   </style>
</head>
<body>
<h1>Demo Heading</h1>
<div class="container">
  <div class="div__one">
    div one
  </div>
  <div class="div__two">
    div two
  </div>
  <a href="https://tutorialspoint.tw"></a>
</div>

</body>
</html>

輸出

單擊橙色 div,連結將開啟 −

更新日期:2022 年 12 月 5 日

6K+ 瀏覽量

開啟你的 職業生涯

完成課程並獲得認證

開始學習
廣告