CSS 3.0 rotate(90deg) 不是“transform”属性的有效值答案

【问题标题】：CSS 3.0 rotate(90deg) is not a valid value for 'transform' propertyCSS 3.0 rotate(90deg) 不是“transform”属性的有效值
【发布时间】：2015-02-04 13:37:11
【问题描述】：

我试图让文本垂直显示在我的列表项中。 http://www.css3maker.com/text-rotation.html# 等几个网站已指示我使用以下内容： -ms 变换：旋转（90 度）； /* IE 9 / -webkit-transform：旋转（90度）； / Chrome、Safari、Opera */ 变换：旋转（90度）；

我已将其放在我的 css 文件中，但 Visual Studio 2010 提供了警告：

验证 (CSS 3.0)：'rotate(90deg)' 不是 '-webkit-transform' 属性。
验证 (CSS 3.0)：'rotate(90deg)' 不是 'transform' 属性的有效值

为什么我会收到此警告？如果我忽略它，它就不起作用，我不会收到有关 -ms-transform 的警告，但它似乎在 IE 中也不起作用。

这是我的代码： CSS：

li.menu_label > span
{
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}

HTML：

<ul id="nav">
    <li>
        <label class="menu_label" for="c1"> <span>Menu</span></label>
        <input type="checkbox" id="c1" />
</li>
</ul>

事实证明，无论警告如何，这都能正常工作，只是在谷歌浏览器中不行。需要添加“display:inline-block”CSS3 transform not working

【问题讨论】：

标签： html visual-studio-2010 css rotation

【解决方案1】：

我猜问题是您使用 Visual Studio 2010 来验证您的 CSS 代码。请记住，VS2010 可能在 2009 年底推出，rotate() property was added to IE9 发布了2 years later。因此 VS2010 不知道该属性的存在。

我的建议是要么忘记用 VS2010 验证你的 CSS，要么升级到最新的 VS 版本。

【讨论】：

谢谢。似乎它不起作用的原因是 rotate 属性在标记上不起作用。我已经将它放在前面的
标记中。