html - 使用 CSS 在悬停时转换列表元素

Question

我在制作它时遇到了麻烦，因此我拥有的链接（嵌套在列表元素中）在它们悬停时会旋转。我一直在这样做：

li:hover {
  color: #ff0000;
  -webkit-transform: rotate(15deg);
  -moz-transform: rotate(15deg);
  transform: rotate(15deg);
}

我知道正在应用 CSS，因为颜色会发生变化。我知道我的语法是正确的，因为当我尝试同样的事情时，替换nav为li，它起作用了。出于某种原因，这是否有理由li特别适用于 s ？

score 1 · Accepted Answer

您的 li 是否设置为块元素？

我添加了这个 CSS：

li {
    display: block;
    width: 100px;
    height: 20px;
}

score 1 · Accepted Answer

您可以尝试将您的 css 中的 li 选择器更改为链接选择器，然后添加

display:inline-block;

见http://jsfiddle.net/xKNrQ/。您可以将 display 属性添加到 li 选择器，但是您必须使用单独的规则来应用 <a> 标记的颜色更改。

2 回答 2