我经常用<a>标记包装块级元素,以使整个组可单击。例如,假设我有一个事件列表:

<ul>
    <li>
        <a href="#" style="display: block;">
            <div style="float: left; display: inline;">12/12/2010</div>
            <div style="float: left; display: inline;">Some event information</div>
        </a>
    </li>
    <!-- etc... -->
</ul>

注意:内联样式仅适用于示例。
这样,整个东西是可点击的,而不仅仅是元素中的文本。
当然,位于validator.w3.org的(x)html验证器不喜欢这样,因为我已经将块级元素(<div>)放置在内联级元素(<a>)内部。尽管如此,我还是使用CSS将<a>标记定义为块级,并将<div>标记定义为内联。
我一直按照经验法则编写代码,您应该始终努力编写有效的代码;但是,如果您的代码没有验证,并且您理解为什么它没有验证,并且您有一个不验证的有效原因,那么不要担心它。
所以我的问题是三个方面:
这是不验证的有效原因吗?
可用性增益(通过拥有更大的可点击区域)是否值得不验证?
有更好的办法吗?

最佳答案

使用下面的span是完全有效的,您可以达到相同的效果。

<a href="#" style="display: block;">
    <span style="float: left;">12/12/2010</span>
    <span style="float: left;">Some event information</span>
</a>

关于html - <a>标签中的块级元素,验证与可用性,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/3303008/

10-12 12:39
查看更多