html - 将图片包裹在标签中，但仅在文本下划线

My screenshot http://dl.getdropbox.com/u/240752/stars.gif
我想要它，这样只有文本有下划线。我能看到的唯一办法是：

.no-underline {
   text-decoration:none;
}
.underline {
  text-decoration:underline;
}

<a href="#" class="no-underline"><span class="underline">Average customer review rating</span><img src="img/five-stars.gif" alt="five stars" width="78" height="16" title="5 star review rating" /></a>

这是最好的办法吗？或者有人知道一个更精简的方法？谢谢。

最佳答案

没有其他的解决办法。尽管你可以把它缩短一点：

<a href="#" class="imgLink"><span>Link Text</span> <img src="..."></a>

a.imgLink { text-decoration: none; }
a.imgLink span { text-decoration: underline; }

这样你只需要指定一个类。