Question

为什么H2标签外的锚点工作而不在H2标头标签内？

这是我的php滑块的第一部分，我想拥有W3C有效的XHTML页面，所以我把它编码如下..

如果我按照可以通过W3C验证器进行验证的方式执行此操作，则锚链接不起作用。

我应该做一些有效但不起作用的<h2><a class="" href="" taget="_blank">Valid!</a></h2>。

开始编辑 Doctye：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

我的代码中有值，我的代码可以在下面找到这一行只是一个示例，用于显示<h2>和<a>应该如何嵌套，所有php代码正在工作并有输出。当我在锚点内嵌入H2时有一个验证问题，但它正在工作，当我这样做时，所有100％W3C有效，但锚点无法正常工作...当定义id时，锚点可能会起作用对此，我没有尝试定义id来锚定..

结束编辑

我在<H2>

中使用CSS作为图像背景文件

当我执行以下操作时，一切正常，但它永远不会被W3C验证，W3C验证对此项目很重要。

下面的代码是我的原始代码，它正在运行但无效（锚内的H2应该在H2标签内锚定 - W3C）

<div class="slide-info">
    <a title="<?php echo Slider_HeaderTitleText_echo($Eerste_Slider_Header_Title); ?>" href="<?php echo $Eerste_Slider_Header_URI; ?>" target="_blank">
        <h2 class="notext txt-eerste"><?php echo Slider_HeaderTitleText_echo($Eerste_Slider_Header_Title); ?></h2>
    </a>
    <p><?php echo Slider_HeaderMainText_echo($Eerste_Slider_Header_Main_Text); ?></p>
    <span class="align-left">
        <a href="<?php echo $Eerste_Slider_Header_URI; ?>" class="purplesmallbutton">more</a>
    </span>
</div>

后来添加：由php生成（页面源和style.css文件中的一些css）：

`#slider-holder .slide-info { float: left; display: inline; width: 424px; padding-top: 23px; }
#slider-holder .slide-info p { padding-bottom: 8px; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; background-repeat: no-repeat; }
h2.txt-eerste { height: 60px; background-image: url(http://www.awesomehosting.nl/banners/aanbieding.png); }`



<div class="slide-info">
                            <a title="no title 1" href="http://www.yahoo.com" target="_blank"><h2 class="notext txt-eerste">no title 1</h2></a>
                            <p>Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text .</p>
                            <span class="align-left"><a href="http://www.yahoo.com" class="purplesmallbutton">more</a></span>
                        </div>

我应该更改什么才能使链接正常工作并且XHTML有效？

Answer 1

问题是您偏移了h2内的文字。有效地将a移出h2，以便您的可点击a标记也已被抵消。取而代之的是偏移a内的文字并将其作为一个块。

.notext2
{
    background-image:url(your url in here);    
    width:350px; //replace with what you need
    height:150px; //replace with what you need
}

.notext2>a
{
    display:block;    
    width:100%;  
    height:100%; 
    text-indent:-9999px;
}

Demo

您可以使用HTML 5代替将hx标记放入a标记并且target=""也有效的地方。 HTML5 Spec

为什么H2标记之外的锚点工作而不是H2标记标记内部

1 个答案: