嵌套HTML標籤

我想這樣做：

<li> 
<a> 
    <p>text</p> 
    <p class="x">text</p> 
</a> 
</li>

我知道我不能。那麼我怎麼樣？（沒有JS/jQuery等）

2011-01-26 Mike

您是否在尋找符合標準？因爲你可以做到這一點。 – 2011-01-26 17:08:45

不幸的是，我是！ – Mike 2011-01-26 17:10:46

如果您使用HTML 4.01 Transitional，則符合「符合標準」，否則不符合。你不能用一個內聯元素（* a *）包裝一個塊元素（* p *）。 – BryanH 2011-01-26 17:19:51

更改<p>某些行內元素（例如<span>）並給li a span風格display: block;，我猜。

<li> 
<a> 
    <span>text</span> 
    <span class="x">text</span> 
</a> 
</li>

2011-01-26 17:09:24 BoltClock

當然。但它不符合標準，因爲塊內嵌入 – Mike 2011-01-26 17:11:26

你可以在HTML（5）中做到這一點。但是在某些瀏覽器（Firefox）中的支持很糟糕。參見：http://html5doctor.com/block-level-links-in-html-5/

的最好方法是使用天然的內聯元件，諸如<span> s，而不是錨定內部塊級元素。

2011-01-26 17:12:33 Chris

這證實爲XHTML 1.1：

<li> 
    <p><a href="example.com">text</a></p> 
    <p class="x"><a href="example.com">text</a></p> 
    </li>

2011-01-26 17:15:38 BryanH

我假設你正在爲是要在列表項文本的整個塊，也許整個列表項獲得，是點擊？

首先，段落標記是塊級別的項目，但錨定標記本質上是內聯元素。你不能把它放在一個錨標籤裏，它在語義上是不正確的，它不會被驗證。代替這樣做：

<ul class="myList"> 
<li> 
    <a href="#"> 
     <strong>This is the title</strong> 
     <span>This is the link text</span> 
    </a> 
</li> 
</ul>

假設您希望列表項的整個區域都是可點擊的，您可以應用display：block;使用CSS的錨標記。請注意，如果您爲列表項目指定了不同的高度，並希望所有內容都可點擊，則還需要在標籤上設置高度。

.myList a { display:block; }

如果你想強標籤斷行（你的「正文」中的鏈接）...

.myList a strong { display:block;}

希望幫助！

2011-01-26 17:19:30

回答