儿童锚标签上的CSS父锚标签显示？

Question

我有类似的事情

<a class="item" href="a.htm">
  <div class="title">abcd</div>
  <div class="body">abcd</div>
</a>

具有以下样式

a.item {
  display:block;
}

只要在a.class中添加另一个锚标记，

<a class="item" href="a.htm">
  <div class="title">abcd</div>
  <div class="body">abcd</div>
  <a class="child" href="b.html">child</a>
</a>

即使我有

a.child {
  display:inline
}

它将孩子分成一个单独的块。我该如何解决这个问题？

Answer 1

您无法嵌套<a>元素。将<a>替换为<span>。由于您有两个href属性，我假设您需要以下效果：

演示：http://jsfiddle.net/jE6Dm/

CSS：

a.item span {
  display:block;
}

HTML：

<div>
  <a class="item" href="a.htm">
      <span class="title">abcd</span>
      <span class="body">abcd</span>
  </a>
  <a class="child" href="b.html">child</a>
</div>

Answer 2

ericbae是对的，你不能在标签中使用标签。您在div上应用标记的其他重要事项，它可能无法在Internet Explorer中使用。所以要小心。