CSS3转换不起作用
CSS3转换不起作用
提问于 2011-02-07 18:02:22
我正在尝试通过将菜单项旋转10度来改变它们。我的CSS可以在Firefox中使用，但我无法在Chrome和Safari中复制这种效果。我知道IE不支持这个CSS3属性，所以这不是问题。
我使用了以下CSS：
li a {
-webkit-transform:rotate(10deg);
-moz-transform:rotate(10deg);
-o-transform:rotate(10deg);
}有没有人能告诉我哪里出错了？
谢谢。
回答 4
Stack Overflow用户
回答已采纳
发布于 2011-02-07 18:15:44
这只是一个有根据的猜测，没有看到HTML/CSS的其余部分：
您是否对li a应用了display: block或display: inline-block？如果没有，那就试试吧。
否则，请尝试对li应用CSS3转换规则。
Stack Overflow用户
发布于 2011-02-07 18:25:19
在基于webkit的浏览器(Safari和Chrome)中，-webkit-transform is ignored on inline elements.。将display: inline-block;设置为make it work。出于演示/测试的目的，您可能还希望使用负角度或transformation-origin，以免文本旋转出可见区域。
Stack Overflow用户
发布于 2011-02-07 18:17:43
您是否专门尝试仅旋转链接？因为这样做，on the LI tags似乎工作得很好。
According to Snook转换需要阻塞受影响的元素。他还提供了一些使用过滤器的IE代码，如果你愿意添加它的话(尽管在值上似乎有一些限制)。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4919963
复制相关文章
相似问题