创建有效的XHTML可点击块区域

我试图创建一个“可点击”区域。创建有效的XHTML可点击块区域

<a 
    style="display: block" 
    href="http://stackoverflow.com"> 
    StackOverflow 
</a>

A是一个内嵌元素，但CSS使它成为一个块。

如果上面是有效的，那么下面的应该是有效的太：

<a 
    style="display: block" 
    href="http://stackoverflow.com"> 
    <div>Some DIV that links to StackOverflow</div> 
</a>

但validator.w3.org不应该被标记为无效（它是现在）。

如果它无效，将块元素设置为“可点击”并重定向到任意页面的最合适方法是什么？我知道我可以使用JS onclick来实现这种行为，但谷歌将如何看待这一点？

来源

2009-07-01 Adrian Godong

我不确定xhtml验证与SEO有什么关系。首先，对于喜欢HTML 5的人来说，xhtml并不完全被视为一个好规范。其次，没有任何证据表明网站验证（或缺乏）会影响SEO一点点...... – NotMe 2009-07-01 15:58:09

@Chris：我想让我的网站通过XHTML验证，并且有一个很好的SEO。我并不是说两者都有关系。 HTML5是否具备这种功能？我还希望HTML5标准能够在大约5年内被采用？ – 2009-07-01 16:12:07

我认为内联不能包含块元素的（XHTML）规则应该有一些例外，例如'`元素。否则，没有正常的做法。 – adardesign 2010-03-24 14:54:20

验证器是正确的 - 你不能把<div>放在<a>之内，不管你事后用CSS做什么。

做正确的事是你在你的第一个代码块做了什么 - <a style="display: block;">

如果你想里面的东西，你可以做<a style="display: block;"><span style="display: block;">

来源

2009-07-01 15:41:01 Greg

+1，这是广泛接受的解决方案，可以在很多应该阻塞的内容周围使用锚点。 – molf 2009-07-01 16:04:12

这并不意味着一个是有效的暗示其他必须是。有HTML的嵌套规则，而锚内的div不适合它们，这就是为什么validator.w3.org给你一个很难的时候。

如果你真的必须有一个div，而不是文本，图像或<span style="display: block"> s，那是可点击的，那么是的，你将不得不使用onclick事件。谷歌不会理解或承认链接的存在。（除了onclick div之外，您可以通过在锚点上应用锚点来应对此问题。）

来源

2009-07-01 15:41:05 chaos

首先您需要知道您是要使用严格还是过渡的XHTML（frameset is这里没有用）。然后你看看DTD (link)，你会看到A里面不能有DIV。

来源

2009-07-01 15:42:36 Lucero

尽可能严格，一如既往。 – 2009-07-01 15:46:01

为什么不使用area tag这个？它应该在图像映射中定义可点击区域。

来源

2009-07-01 15:42:37 jjclarkson

它可能不只是一个图像，它应该可用于任何任意块单元。 – 2009-07-01 15:48:14

Google bots现在遵循简单的javascript链接，所以在div的onClick事件中使用JS是一个选项。其他搜索引擎机器人不这样做，但迟早他们会。

更多信息in this article。

来源

2009-07-01 15:47:08 Nicolas

事情我已经在过去所做的有这类问题是调用父元素上的点击（我的例子使用jQuery）：

<div class="link"> 
    <a href="http://www.google.com" title="Google">Visit Google</a> 
</div> 

$(".link").click(function(){ 
    document.location = $(this).find("a:first").attr("href"); 
});

使用样式，你可以使整个区域显得通过设置光标的链接，翻转状态等。

来源

2009-07-01 15:49:18 Sampson

不要混淆有效的HTML和有效的CSS。使用display css属性可以阻止内联元素是有效的。将块HTML元素放在行内是无效的。

来源

2009-07-01 15:56:53 darasd

创建有效的XHTML可点击块区域

回答

相关问题