在css样式表中添加指向图像的链接

Question

我希望在acss样式表中添加一个图像的链接,以便在按下图像时它会链接到链接.

图像本身的代码是:

 #logo{
    background-image: url(images/logo.png);
    width: 981px;
    height: 180px;
    margin-left: auto;
    margin-right: auto;

添加什么代码以允许它导航到超链接？例如:如果我希望它导航到http://home.com

Answer 1

你不能这样做...

通过css,URL你穿上的background-image只是为了图像.

通过HTML您必须以href这种方式添加您的超链接:

<a href="http://home.com" id="logo">Your logo</a>

使用text-indent和其他一些css你可以调整你的元素只显示图像并点击它你会转到你的链接.

编辑:

因为我确定你懒得搜索文字缩进并尝试我的代码,你的图像上有文字我再次在这里向你展示并解释为什么我的解决方案要好得多:

<a href="http://home.com" id="logo">Your logo name</a>

这个块HTML是SEO友好的,因为你的链接中有一些文字!

如何用css设计它:

#logo {
  background-image: url(images/logo.png);
  display: block;
  margin: 0 auto;
  text-indent: -9999px;
  width: 981px;
  height: 180px;
}

然后,如果你不关心SEO好选择其他答案.