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

Question

我一直遇到麻烦，所以我的链接（嵌套在列表元素中）会在它们悬停时旋转。我一直这样做：

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

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

Answer 1

你的李被设置为块元素吗？

这有效：http://jsfiddle.net/dQNFF/1/

我添加了这个CSS：

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

Answer 2

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

display:inline-block;

见http://jsfiddle.net/xKNrQ/。您可以将显示属性添加到li选择器，但是您必须使用单独的规则来应用＆lt; a＆gt;的颜色更改。标签