代码之家 › 专栏 › 技术社区 › Drew

如何重写此HTML以验证XHTML1.0的严格性?

xhtml validation html

Drew · 技术社区 · 16 年前

<div>
    <a href="link.html">
        <p>Some text</p>
        <ul>
            <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        </ul>
    </a>
</div>

我的目的是让整个div作为一个可点击的链接。其中的内容只是描述目标页面的内容。W3验证器说我不能有块元素( <p> )跨距标记内( <a>

4 回复 | 直到 16 年前

Robert 16 年前

不允许将块级元素包装到内联级元素中,因此您有一些替代方法。

您可以将要链接到 <a href="link.html">...</a>

<div>
    <p><a href="link.html">Some text</a></p>
    <ul>
        <li><a href="link.html">Item 1</a></li>
        <li><a href="link.html">Item 2</a></li>
        <li><a href="link.html">Item 3</a></li>
    </ul>
</div>â

onclick 函数来重现相同的结果。

 //jQuery
 â$('div').click(function() {
     window.location = 'link.html';
 });ââââââ

 //Non jQuery
 document.getElementById('yourDiv').onclick = function() {
     window.location = 'link.html';
 }

如果使用Javascript,请确保使用CSS使内容明显是链接。我推荐伪类

div {
    text-decoration: underline;
    color: #0000FF;//or whatever your link color is
}
div li:hover, p:hover {
    color: #CC00FF;
    cursor: pointer;
}

jigfox 16 年前

不能重新排列它以使块成为链接。您可以做的是使块中的每个元素都成为链接,也可以使用javascript。

<div style="cursor:pointer" onclick="location.href='link.html'">
  <!-- ... -->
</div>

zwol 16 年前

实际上,您的片段是有效的HTML5。改用它,你的问题就会消失。您所要做的就是将doctype更改为 <!doctype html> .

gilly3 16 年前

<div onclick="location.href = 'link.html'">
    <p>Some text</p>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</div>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Jamie · 在CSS链接的文件名中添加Jinja占位符

1 年前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

1 年前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

1 年前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

1 年前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

1 年前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

1 年前