• 直接来自W3C的HTML 4：*

12.2.2嵌套链接非法

由A元素定义的链接和锚点不能嵌套; A元素不得包含任何其他A元素。
由于DTD将LINK元素定义为空，因此LINK元素也不能嵌套。
HTML 5
而对于HTML5来说，情况就有点不同了。
A元素内不能有交互式内容。交互式内容包括锚标记。

简单地回答这个问题：不，不，不
也就是说，这里有一个纯粹的html/css解决方案：
https://codepen.io/pwkip/pen/oGMZjb
第一个

将嵌套链接 Package 在对象标记内：

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

虽然我完全同意选择的答案，是的，你 * 不应该 * 在一个A元素内有交互式内容，有时你可能需要一个变通办法。
这里有一个例子，你 * 需要 * 把一个交互元素放在一个A标签里。

下面是它的HTML代码。（这不是实际的构建，我使它简单了一些）

<a href="#">
        <span class="hide">X</span> <!-- THIS IS THE SMALL 'X' WHICH HIDES THE WHOLE BOX -->
        <img src="images/camera.svg" width="50" alt="Camera" />
        <em>
            Upload a profile picture
            <small>
                Here's the deal. Make your profile look awesome and even get 25 karma for it. We're not kidding.
            </small>
        </em>
        <strong>
            + 25 K
        </strong>
    </a>

所以，基本上我们希望在用户点击'X'时隐藏这个框。否则，它应该像一个简单的A标记一样工作。下面是实现这个技巧的jQuery。

$('.hide').click(function(e) {
            e.preventDefault();
            e.stopPropagation(); // THIS IS THE KEY PART
    
            // DO WHATEVER YOU WANT, I FADED OUT THE BOX FOR EXAMPLE
            $(this).parent().fadeOut(300);
    });

我希望这对有同样问题的人有帮助。）

我会重新设计它的样式，使其更像以下格式：

<div class="sp_mngt_bar">
    <h1><a href="#"<?php echo $v; ?></a></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>

嵌套链接是非法的。若要实现与嵌套链接相同的行为，可以执行以下操作：
使用如下所示的@mikevoermans HTML格式并绑定click事件

<div class="sp_mngt_bar">
    <h1><a href="#"<?php echo $v; ?></a></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> 
</div>

单击事件应如下所示：

$(".sp_mngt_bar").bind("click", function(e) {   
    var target = $(e.target);
    if(target.has('.t_icons_settings') { //Do something for settings } 
    else if(target.has('.t_icons_move') { //Do something for move }
    else { //Do something for sp_mngt_bar
});

虽然从技术上讲这不是问题的答案，但另一种解决方法是将click事件绑定到span或div：

<a href="outer-link">
  Outer Link
  <span class='inner-link'>Inner Link</span>
</a>

$('.inner-link').click(function (e) {
    // Prevent the click-through to the underlying anchor
    e.stopPropagation();

    // Go to a link
    window.location.href = 'page.html';
    // Or call a javascript method
    doSomething();

    return false;
});

一种解决方案是将链接绝对定位在父链接容器内：

<div style="position: relative">
  <a href="#">
    <h1><a href="#"<?php echo $v; ?></a></h1>
    <div id="placeholder" style="height: 24px">
  </a>
  <div style="position: absolute; bottom: 0">
    <a href="#"></a>
  </div>
</div>

@朱尔斯回答，只是更短：

.parent {
  position:relative;
}

.overlay-link {
  position:absolute;
  inset: 0;
}

HTML格式：

<div class="parent">
    <a class="overlay-link" href="..."/>
    <div class="child">
                    
    </div>
</div>