是否可以有一个空的锚标签？ [英] Is it OK to have an empty anchor tag?

问题描述

我知道如果我想将图片变成可点击的链接，我可以执行以下操作：

I know that I can do the following if I want to turn an image into a click-able link:

<a href="http://twitter.com/username"><img src="icons/twitter.png" /></a>

但我宁愿使用CSS背景图片，以便我可以有一个悬停状态： p>

But I would prefer to use a CSS background image so that I can have a hover state:

<a class="twitter" href="http://twitter.com/username"></a>

# css
.twitter{display:block; width:16px; height:16px; background:url("twitter.png")}

完全有效具有不包含任何内容的锚链接。 Chrome会像FF一样正常显示，但我不知道其他人是否也一样。

This works fine except I'm not sure it's entirely valid to have an anchor link that contains nothing. Chrome renders it fine, as does FF, but I'm not sure if others are the same.

我意识到我可以在链接中放置一些文本，它与 text-indent：-9999px ，但我从来不喜欢这种方法，各种 原因< a>。我的代码是否在跨浏览器兼容？

I realise I could just put some text inside the link, and hide it with text-indent: -9999px, but I've never liked that approach, for various reasons. Is my code above cross-browser compatible?

推荐答案

这是有效的，但最好是把东西放在那里， like

It's valid, but it's best if you did put something in there and used something like

font-size: 0;

将其隐藏。这样，如果某人没有CSS（例如屏幕阅读器），他仍然可以知道该链接是什么。

to hide it away. This way, if someone does not have CSS (screen readers for example), he would still be able to tell approximately what the link is about.

这是一篇关于这个主题的精彩文章

Here's a great article on the subject

这篇关于是否可以有一个空的锚标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！