编码风格 - 带有描述的图像链接答案

【问题标题】：coding style - image links with description编码风格 - 带有描述的图像链接
【发布时间】：2011-04-03 03:59:12
【问题描述】：

我想知道如何格式化我的代码。哪个更好？

<a href="http://stackoverflow.com">
<img src="http://localhost/g3.jpg" alt="" height="90" width="150">
Q&A for professional and enthusiast programmers
</a>

或

<a href="http://stackoverflow.com">
<img src="http://localhost/g3.jpg" alt="" height="90" width="150">
</a>
<a href="http://stackoverflow.com">Q&A for professional and enthusiast programmers</a>

【问题讨论】：

标签： html image hyperlink

【解决方案1】：

我肯定会选择第一个，除非您有两个链接的特定原因。不要考虑正确的编码风格，而是考虑可用性方面的意义。

请注意，您还可以选择仅使用链接中的文本，并将图像设置为 CSS 中链接的 background-image 属性。在许多情况下，除非图像本身对于理解链接至关重要，否则我会这样做。

在这种情况下，最好的办法是思考“哪种 HTML 结构最准确地代表了我希望用户如何看待这个元素？”

【讨论】：

【解决方案2】：

这完全取决于你想要得到什么：

如果您只想要一个链接（我想是这种情况，在这里？），那么请使用第一个解决方案
如果您想要两个不同的链接（不知道为什么要在这里，因为它们都指向同一个位置），然后使用第二种解决方案。

在这里，您希望 <img> 和文本链接到同一页面 - 所以，我想说只使用一个 <a> 更合乎逻辑

【讨论】：

【解决方案3】：

第一个对我来说更有意义（因为您希望图像和文本都成为链接的一部分，我认为没有理由制作两个链接）。

【讨论】：