解决href中的href?

时间:2012-02-27 23:40:40

标签: html css href

我使用CSS工具提示,必须用“a href”包装才能工作。

<a href="#">
<img src="http://www.url.com/image.png" alt="" width="20" height="20" />
<span class="tooltip center white">
<img src=" http://www.url.com/image.png" alt="" width="80" height="80" />iPad [add_to_cart_anchor item="ipad"]purchase the iPad[/add_to_cart_anchor] </span>
</a>

如您所见,我正在使用“The Tooltip”和Cart66(使用锚码短信)。

输出如下:

<a href="#">
<img width="20" height="20" alt="" src="http://www.url.com/image.png"/>
<span class="tooltip center white">
<img width="80" height="80" alt="" src=" http://www.url.com/image.png"/>iPad </span>
</a>
<a href="http://www.url.com/cart?task=add-to-cart-anchor&amp;cart66ItemId=1">purchase the iPad</a>

问题在于“购买iPad”是一个href包装在代码中的href内部,因此它被丢弃在工具提示之外。我怎样才能对此进行排序,以便“购买...”链接仍然在范围内,因此工具提示仍然允许工具提示工作? (我在没有<a>换行的情况下进行了测试,然后工具提示根本不起作用。)

1 个答案:

答案 0 :(得分:2)

您可以将:hover选择器用于任何元素,而不仅仅是锚点:

HTML:

<span class="tooltipwrapper">
  ...
</span>

所以在CSS中你会有:

span.tooltipwrapper:hover .tooltip {
  ...
}

而不是:

a:hover .tooltip {
  ...
}

它应该也一样。