嵌套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

回答