html - 链接框的问题

Question

我想悬停一个链接( <a> 标签，其中包含一个 <div> 标签)，所以只有当我悬停在黄色区域时颜色才会变成红色!我的问题是，如果光标不在黄色字段上，您也可以将其悬停。

我知道我可以将 a 标签放入 div 标签中，但我想链接整个框而不仅仅是文本。

我也尝试使用 a { width: 100px; }但这当然行不通。

https://jsfiddle.net/3phy4950/

有什么办法可以解决这个问题吗？

Answer 1

它不适用于宽度，因为您正在将此样式应用于 a 标签。但是默认情况下，标签是内联显示的，这意味着它们不会占用整个空间/行。

div标签默认是display block，即占满空间/行。

您需要将显示样式从 a div 更改为内联:

a div {
   display: inline;
}

参见 Fiddle