HTML实现以下内容的有效方法

Question

通过http://www.ubuntu.com/business/cloud/overview运行Ubuntu云页http://validator.w3.org/会产生一些错误，其中大多数错误都集中在<divs>和<h>等内{} 1}}标签。

我感兴趣的实现是带箭头的四个框，当你将鼠标悬停在它们上方时会改变颜色（因为它们是<a>链接）。实现这个的有效方法是什么？

Answer 1

实现此目的的有效方法：

• 分隔每个块内的链接。将:hover效果放在父div上，而不是链接上。缺点：更多标记

• 仅使用单个链接中的内联元素，如有必要，使用CSS将其更改为display: block元素。缺点：可能较少的语义

• 使用HTML5 doctype，因为[X] HTML5允许这种构造。缺点：HTML5的当前移动目标性质不太容易验证。

Answer 2

其中每一个都可以是（带有：悬停效果来改变背景颜色/图像），而位于里面的，只用height和{{1}覆盖整个div在你的CSS中。