1

我有这个奇怪的问题。

当我将锚标记包裹在 div 周围时，html 标记会完全改变.. 清除缓存和所有内容。

它关于带有类传出链接的锚点

代码编辑器中的 Html（正确代码）：

<a class="outgoing-link" href="#">
    <div id="content-element">
        <div class="top-info">
            <span class="title-provider">Vodafone</span>
            <img src="phone-placeholder.png" 
                 alt="placeholder" 
                 width="58px" 
                 height="50px"/>
            <div class="bg-circle"></div>
            <span class="dur-discount">1e 3 maand</span>
            <span class="price-discount">&#8364; 16,50</span>
            <span class="dur-normal">Daarna</span>
            <span class="price-normal">&#8364; 20,00</span>
        </div>
        <a href="#" title=""><h3>iPhone 4GS abonnement</h3></a>
        <p><span>100</span> min & sms <span>500</span> mb</p>
        <p><span>2 jr</span>telefoon abonnement</p>
        <p>Prijs telefoon: <span>Gratis</span></p>
        <div class="hover-extra-info">
             <p>Aansluitkosten: <span>&#8364; 24,95</span></p>
             <p>Vodafone abonnement</p>
             <p>aanbieder: Student Mobiel</p>
             <p>Totale kosten over 2 jaar</p>
             <p>&#8364; 547,22</p>
        </div>
    </div><!-- end content-element-->   
</a>

浏览器中的代码：

<a class="outgoing-link" href="#"></a>
    <div id="content-element">
        <a class="outgoing-link" href="#">
            <div class="top-info">
                <span class="title-provider">Vodafone</span>
                <img src="phone-placeholder.png" 
                     alt="placeholder" 
                     width="58px" 
                     height="50px"/>
                 <div class="bg-circle"></div>
                 <span class="dur-discount">1e 3 maand</span>
                 <span class="price-discount">&#8364; 16,50</span>
                 <span class="dur-normal">Daarna</span>
                 <span class="price-normal">&#8364; 20,00</span>
             </div>
         </a>
         <a href="#" title=""><h3>iPhone 4GS abonnement</h3></a>
         <p><span>100</span> min & sms <span>500</span> mb</p>
         <p><span>2 jr</span>telefoon abonnement</p>
         <p>Prijs telefoon: <span>Gratis</span></p>
         <div class="hover-extra-info">
         <p>Aansluitkosten: <span>&#8364; 24,95</span></p>
         <p>Vodafone abonnement</p>
         <p>aanbieder: Student Mobiel</p>
         <p>Totale kosten over 2 jaar</p>
         <p>&#8364; 547,22</p>
     </div>
</div><!-- end content-element-->

它添加了另一个链接并将它们放在错误的位置。

关于发生了什么的任何想法？或者我只是错过了什么。

任何帮助，将不胜感激 ：）

4

2 回答 2

2

我认为这是因为嵌套的锚标签是非法的

见：http ://www.w3.org/TR/html401/struct/links.html#h-12.2.2

在保持功能不变的情况下，不用嵌套锚标记应该很容易。

于 2012-08-16T11:06:56.570 回答
1

可以尝试自动修复无效的 HTML（=> Quirksmode ？），因为 achor-tag 不应包含 -Tags。

尝试在文件开头添加 DOCTYPE 语句，这会改变行为吗？

Doctype-Statement（必须在 HTML 文件/输出的第一行）可能是这样的：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                      "http://www.w3.org/TR/html4/loose.dtd">
于 2012-08-16T11:08:13.430 回答