div内锚

时间:2009-07-07 11:10:32

标签: html hyperlink

这不会一直发生。如果无法复制,错误不是错误!

首先,我认为这是我的年轻编程技巧的错误,但在我的两个网站中出现同样的错误,显然是在相同的情况下。

<a style="display:block;" href="link">
 <div>text1</div>
 <div>text2</div>
</a>

有时,在浏览时,其中div的链接呈现奇怪的结果,页面上没有任何理由出现重复的元素,文本在不同的链接之间分配,真是一团糟。

真正的截图:

http://cupacupelor.ro/img/help.jpg
http://www.carbroker.ro/img/help.jpg

有人遇到过这个问题吗?有解决方案吗?我对涉及JavaScript的修复不感兴趣!

2 个答案:

答案 0 :(得分:18)

我猜你的链接中的div会导致某些浏览器不一致(可能是你在这里播放的CSS)。

“语义”,有效标记是一些流行语。

那么为什么你想要一个<A>标签中的DIV。你可以试试像这样的

<a href="#">
       <span class="divstyle">Text 1</span>
       <span class="divstyle">Text 2</span>
</a>

然后在CSS

.divstyle { 
    display: block; //and other styles etc
 }

答案 1 :(得分:12)

在HTML验证程序中检查您的页面。我90%肯定你不能在<div>之类的内联元素中使用<a>元素。即使您已将链接设置为display:block,但仍然不允许这样做,浏览器可能会吐出他们的假人。

您可以做的是使用跨度,将它们设置为阻止:

<style type="text/css">
  .link, .link span { display: block; }
</style>
<a class="link" href="example.com">
 <span>text1</span>
 <span>text2</span>
</a>