Are Nested Links Allowed in HTML4 and HTML5?

Nested Links: A Permissible Practice?

Nested links, where one link is placed within another, have raised questions about their legality and proper implementation. Let's delve into this topic and address the issue.

W3C HTML4 Perspective:

According to the W3C HTML4 specification, nesting links is prohibited. Specifically, the A element, which defines links and anchors, cannot contain other A elements. Additionally, since the LINK element is declared as empty in the DTD, nesting LINK elements is also not permitted.

HTML5 Interpretation:

HTML5 takes a slightly different stance on nested links. While it allows interactive content to be nested, it prohibits interactive content from being placed within anchor tags. Since anchor tags are considered interactive content, this implies that nesting links (anchor tags) is not valid in HTML5.

Practical Implementation:

In your specific case, where you wish to create a clickable grey bar with additional links for settings and movement, the following code would not be compliant with HTML4 or HTML5 standards:

<a href="#" class="sp_mngt_bar">
    <h1><?php echo $v; ?></h1>
    <a href="#" class="t_icons t_icons_settings sp_mngt_settings"></a>
    <a href="#" class="t_icons t_icons_move sp_mngt_move"></a>
</a>

Recommended Approach:

To achieve your desired functionality while adhering to standards, it is recommended to use JavaScript to handle the click event on the grey bar. This approach would allow you to add multiple links without violating the nesting rules.

The above is the detailed content of Are Nested Links Allowed in HTML4 and HTML5?. For more information, please follow other related articles on the PHP Chinese website!