HTML5在a标签内放置块级元素示例代码
程序员文章站
2023-12-09 15:03:57
你没看错:用一个A标签包裹块级元素，在HTML5以前，a标签属于行内元素，而div,h1,p 等为块级元素，如果强行包裹，可能会被强行截断为多个a标签，感兴趣的朋友可以了解些... 13-08-23...
对比起xhtml来说，html5通过更简单的元素引起了一系列的思考，坦诚地讲,这真的是急需的简化。这些简化之一就是能够通过<a>标签包装像div,h标签(h1...h6),和段落标记p 这些块级元素。你没看错:用一个a标签包裹块级元素(译者注: 在html5以前，a标签属于行内元素，而div,h1,p 等为块级元素，如果强行包裹，可能会被强行截断为多个a标签。当然，都是浏览器的事啦。).
示例代码：
<body>
<a href="/about-page.php">
<div class="article">
<h1>关于 david walsh</h1>
<p>
原文作者是27岁的 web developer, 并且是jquery & mootools方面的专家级顾问,地址为 madison, wisconsin. 同时也是wynq web 实验室的创始人兼主程 . 格言：“我并不设计网站,只是让他们跑起来.”
</p>
</div>
</a>
</body>
就是这样，一个a标签包裹着div,p,h1这样的元素，需要注意的是，你不能在一个a标签内包含另一个a标签，否则发生什么事，可能是各个浏览器不一致的。
你如何看待？
对于用a标签包含着块级元素我很矛盾,快速查看时感觉就像一堆垃圾代码。另一方面，为了回避这种方式，我们一直使用javascript来处理。可点击元素的目的就是为了完成任务和功能，而使用原生html来完成这种功能比起js来说更自然，有时候肯定会很方便。我想问的是：对于这个实践你如何看待？你能立即使用吗？请分享您的观点！
(译者注：在译者的项目里，一个组员就使用了这个功能。在myeclipse里面看着很难过，因为是一堆的黄色警告。但是客观来说，有时候有些代码确实很有效，比如什么<red>之类的)
示例代码：
复制代码
代码如下:<body>
<a href="/about-page.php">
<div class="article">
<h1>关于 david walsh</h1>
<p>
原文作者是27岁的 web developer, 并且是jquery & mootools方面的专家级顾问,地址为 madison, wisconsin. 同时也是wynq web 实验室的创始人兼主程 . 格言：“我并不设计网站,只是让他们跑起来.”
</p>
</div>
</a>
</body>
就是这样，一个a标签包裹着div,p,h1这样的元素，需要注意的是，你不能在一个a标签内包含另一个a标签，否则发生什么事，可能是各个浏览器不一致的。
你如何看待？
对于用a标签包含着块级元素我很矛盾,快速查看时感觉就像一堆垃圾代码。另一方面，为了回避这种方式，我们一直使用javascript来处理。可点击元素的目的就是为了完成任务和功能，而使用原生html来完成这种功能比起js来说更自然，有时候肯定会很方便。我想问的是：对于这个实践你如何看待？你能立即使用吗？请分享您的观点！
(译者注：在译者的项目里，一个组员就使用了这个功能。在myeclipse里面看着很难过，因为是一堆的黄色警告。但是客观来说，有时候有些代码确实很有效，比如什么<red>之类的)