a標籤嵌套怎麼解決

我們知道，在實際的網頁佈局之中，有時候是需要一整塊點擊區域中間還要有部分的按鈕點擊，那麼就是A標籤嵌套A標籤了

outerA innerA

#但我們會發現，這個嵌套，瀏覽器會直接錯誤解析，解析結果如下：

outerA innerA

那麼針對這種情況如何解決呢？

方案一：使用object標籤進行嵌套

例如我麼如下寫，就不會錯誤解析了！

outerA innerA 登入後複製 這種寫法的典型應用最多的是列表整個需要點擊，列表裡面有電話號碼需要單獨點擊撥打！

列表内容 拨打电话 登入後複製 方案二：使用定位方式

這種方式是迫不得已的方式，想法就是我們不用嵌套。直接程式碼如下書寫：

outerA innerA 登入後複製 外層的haorooms透過設定 display :inline-block，以及 絕對定位 ，將其放在裡層a標籤的位置。然後透過調整裡層a標籤及外層a的 z-index 大小，使得滑鼠能正確選取a標籤；

這種方法的核心思想就是透過定位來模擬實現我們想要達到的效果！

方案三：使用HTML的 標籤來實現

記得在學校學校網頁製作的時候，用的是dreamweaver，dreamweaver中可以使用 圖片 熱區來實現圖片的點擊效果。沒錯，我們可以使用熱區來實現a標籤的嵌套效果啊！

area標籤很久沒使用了，普及一下基礎：

area可以指定shape及coords。

如果 shape 屬性 設定為 "rect"，則該值規定矩形左上角和右下角的座標。 （x1,y1,x2,y2）

如果 shape 屬性設定為 "circ"，則該值規定圓心的座標和半徑。 （x,y,radius）

若 shape 屬性設為 "poly"，則該值規定多邊形各頂點的值。如果第一個座標和最後一個座標不一致，那麼為了關閉多邊形，瀏覽器必須加入最後一對座標。 （x1,y1,x2,y2,..,xn,yn）

area和map要配合使用，可以在圖片上面指定部分熱區，也可以在清單中指定熱區。

假如我們運用area和map在列表中a標籤內部指定熱區，就可以實現類似我們上面a標籤嵌套的效果了！

還是上面的例子，我們可以如下書寫：

outerA 登入後複製 方案四：使用span等標籤加js事件來取代a標籤

當然我們也可以用span，標籤等替代a標籤，只不過要多寫一些js跳轉程式碼了，透過js來實現a標籤所能實現的效果！

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

php8，我來也