Question

我正在尝试为自己创建一个设计博客和图库，这就是为什么我对CSS3进行了一些实验。我实现了我想要的其他浏览器的结果，现在IE让我头疼。

我使用CSS为我的博客文章创建了旋转日期标记：

.metadata {
margin-left: -108px;
margin-top: 140px;
width: 140px;
position: absolute;
text-align: right;
} 

.postdate {
display: block;
/* Safari */
-webkit-transform: rotate(-90deg);
/* Firefox */
-moz-transform: rotate(-90deg);
/* Opera */
-o-transform: rotate(-90deg);
font-size: 70px;
color: #ffffff;
}

好吧，我是怎么做的可能并不那么重要。无论如何：我也尝试在IE中旋转文本，我设法使用IE特定的代码，但渲染的结果非常糟糕，我不想使用它。现在，如果没有旋转代码等，日期标记自然就不会出现在IE中。

我希望使用条件CSS在IE中创建一个完全不同的日期标记外观，但我不确定如何，我第一次尝试这样的事情。

<!--[if IE ]>
<link rel="stylesheet" href="iecss.css"  type="text/css" media="screen">
<![endif]-->

在那个iecss文件中，我包含了相同的CSS类，规则略有不同：起初我只试图将字体大小减去50像素。我的计算机上只有IE 8，它在那里完全没有效果。我用IE NetRenderer预览了我的网站，暗示文本大小改变在IE 7中工作（好吧，实际上在IE 6中也是如此，但我不愿谈论设计中发生的其他事情））。

那么为什么它在IE 8和（根据NetRenderer）IE 9中没有做任何事情？我也试过使用[if gte IE 8]，但它也没有做任何事情。

问题是当IE理解主CSS文件中的规则并且没有显示结果应该是没有问题时，它不能用相同类的新CSS规则覆盖效果吗？

有没有办法让IE的所有版本完全忽略那些CSS规则并跟随其他版本（这会使IE中的日期标记看起来完全不同）？或者，有没有办法告诉IE不要显示日期标记？由于我的网站刚刚开始实验，因此在IE中显示发布日期并不是什么大不了的事。 PHP可以为我做后者吗？

Answer 1

对于IE 9支持，添加：

-ms-transform: rotate(-90deg);

对于IE 8及更低版本添加：

filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

数字3表示-90（270）度，0表示0度，1表示90度，2表示180度。

链接：
http://jsfiddle.net/Eqkjh/2/
http://css-tricks.com/snippets/css/text-rotation/

IE的排版调整使用条件CSS ...或其他？

1 个答案: