图片链接隐藏链接下面的链接

我有一个重叠图片链接的问题，它隐藏下面的另一个链接。图片链接隐藏链接下面的链接

<div id="header-first"> 
     <div id="logo"> 
      <a title="Αρχική" href="/"> 
      <img alt="Αρχική" src="/sites/default/files/acquia_marina_logo.png"> 
      </a> 
     </div> 
</div>

问题是该代码下面有一个链接，图像偏重于它。我怎样才能保持图像的位置，但阻止它隐藏下面的链接？在本质上，我希望“可链接”块更短，保持图像相同。

改写的问题：

图片链接可以有链接的面积是不完全包含的图像上方？

来源

2010-10-27 thanos panousis

可能想告诉我们你的CSS看起来像 – hunter 2010-10-27 13:24:51

你是什么意思的“隐藏另一个链接”？你能更好地阐述这个问题吗？ – Kangkan 2010-10-27 13:27:13

也许：

#logo { 
    margin-bottom:npx; /* where n = pixel value */ 
}

来源

2010-10-27 13:37:07 Freyr

我不知道，如果你使用的是浮动的，但可能会对它也有影响。你可以在a标签下面扔出一个清晰的div

来源

2010-10-27 15:08:18 Ascherer

所以基本上，你希望链接位于重叠的图像上方，是正确的吗？有几种方法可以解决这个问题：

1.CSS - 绝对定位#logo - 将其从文档流中取出，其后的任何内容都将位于该文档的顶部。绝对定位是它自己的野兽，然而，如果你不熟悉它，研究和了解它。

#logo { position:absolute; top:0px; left:0px; } //make the parent div {position:absolute} to contain the absolute div

2.确保链接出现在html中的徽标后面，并给它一个负顶部边距以将其拉到图像上。

.link_css {margin-top:-10px; }

3.CSS z-index。该选项要求浏览器知道每个项目的位置（通常通过css定位）才能正常工作。

 
#logo {z-index:0} 
.link_css {z-index:1}

只是一些概念，但很难推荐它们中的任何一个而不知道更多关于您的代码。猎人有一点：它会很高兴看到你的CSS

来源

2010-10-27 15:13:46 jonkratz

每次我必须在此发布问题时，我都比我开始时更了解我的问题。正确的问题是：图像链接的链接区域是否不在其包含的图像之上？ – 2010-10-27 17:54:02

我仍然不确定我是否明白你需要的是什么。您可能必须更改标记才能这样做。你可以试试img地图 - http://www.w3schools.com/tags/tag_map.asp，但请记住，他们正在贬值的路上，如果尚未 - http://stackoverflow.com/questions/3528746/ - 图像，地图，地图弃用 – jonkratz 2010-11-02 15:05:46

图片链接隐藏链接下面的链接

回答

相关问题