有效的HTML：'a'元素內的ul，p，div
[英]Valid HTML: ul, p, div inside 'a' element
問題描述
我有一個div，如果您在div上的任意位置單擊，它將打開另一個網頁。 因此，基本上整個div都是巨大的超鏈接。 因此，我有一個div ，然后在里面有一個元素，然后在里面有div的所有元素（所以有ul ，有p等）。
我的問題：當我嘗試在w3標記驗證器中驗證HTML時，出現錯誤，因為在元素內部有ul，p等 。
實際錯誤：
文檔類型此處不允許元素“ p”； 缺少“對象”，“小程序”，“地圖”，“ iframe”，“按鈕”，“ ins”，“ del”開始標簽之一
如何使HTML有效並仍將div保持為一個大鏈接？
<div id="rentalAnnc">
<a class="sidebarLink" href="facilitiesForHire.html">
<p>KAZCARE has a range of Education Facilities available for Lease & Hire at its Bowral location.</p>
<!--<p>Click here for more information.</p>-->
</a>
</div>
5 個解決方案
解決方案1
3 2011-09-21 05:54:55
您只能在HTML 5的錨點中包含塊級內容。不能在任何非草稿版本中使用。 如果您希望它符合*規范，請切換到HTML 5。
請注意，這樣做會導致問題 。
*不要談論<ins> hack，它可以使您以有效但不符合規定的方式進行操作，因為DTD的表達能力不足以禁止它，但是規范文本是
解決方案2
2 2011-09-21 06:05:17
如果可能的添加onclick屬性的div而不是使用a標簽。 例如：
<div id="rentalAnnc" onclick="window.location.href='facilitiesForHire.html'" style="cursor: pointer">
<p>KAZCARE has a range of Education Facilities available for Lease & Hire at its Bowral location.</p>
<!--<p>Click here for more information.</p>-->
</div>
解決方案3
1 2014-04-22 15:21:30
正如“昆汀”在他的回復中所說，只能使用HTML5來驗證這種鏈接。 為此，請將文檔的定義（HTML的第一行）更改為：
<!DOCTYPE html>
這樣做，您的HTML現在將變為HTML5（魔術！），並且在href標記內允許使用[h1]和[p]塊元素，並遵循標准：
<a href=”Destination.html”>
<h3>Cool link</h3>
<p>The coolest link in the world.</p>
</a>
當然，這是有問題的，因為您可能具有以前的文檔定義，如下所示：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
將文檔類型從“嚴格”更改為“過渡”或HTML5會使瀏覽器呈現的元素略有不同（特別是在快速模式下），因此您應再次檢查如何使用新的doctype呈現頁面。
我討厭HTML自HTML5以來就不允許這樣做，因為如果HTML的語義需要有標頭和parragraf作為鏈接，則標准應該允許您這樣做。
無論如何，請仔細考慮這種“錨點內部的塊級”將如何影響可訪問性，因為鏈接中的內容過長對於使用屏幕閱讀器的盲人來說可能是個問題。
現在，為內部帶有塊元素的錨點提供一個不錯的CSS樣式，並享受它！ :)
解決方案4
1 2011-09-21 05:56:15
在錨點中，您可以擁有的只是其他內聯元素。 查看W3C文檔：
解決方案5
0 2014-05-07 05:42:15
您可以將display設置為<a>元素阻止，並使用它代替<div> 。
因此，如果您有以下內容： <a href="#"><div style="width: 100px; height: 100px; background-image: url('xyz.png');"></div></a>
改為使用： <a href="#" style="display: block; width: 100px; height: 100px; background-image: url('xyz.png');"></a>
添加一個 Div 元素<p>里面和<section>
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.