Html CSS转换和动画不适用于IE(适用于Firefox/Chrome)

Html CSS转换和动画不适用于IE(适用于Firefox/Chrome),html,internet-explorer,css,Html,Internet Explorer,Css,我如何编辑我的代码使其在IE中工作。它在Firefox和Chrome中工作得很好。 我无法找出在Internet Explorer中调用转换和动画的正确属性 <html> <head> <title> Sample for Konstantin</title> <style type="text/css"> .text p {text-align:center; margin-left:auto; margin-right:auto;

我如何编辑我的代码使其在IE中工作。它在Firefox和Chrome中工作得很好。 我无法找出在Internet Explorer中调用
转换
动画
的正确属性

<html>
<head>
<title> Sample for Konstantin</title>
<style type="text/css">

.text p
{text-align:center;
margin-left:auto;
margin-right:auto;
left:50%;

}
.text {

    overflow: hidden;
    margin-bottom: 110px;
    }

.text h1 {
    color: black;
    font-family: 'footlight mt light';
    font-size: 50px;
    -webkit-animation-name: fade-in;
    -webkit-animation-duration: .9s;
    letter-spacing: -10px;

    }
    a { text-decoration:none }

    .text h1 span a {
        -webkit-transition: 0.9s ;
                color: #9C948D;
        }

        .text h1:hover span a {
            color: blue;
            }


</style>
</head>
<body>
    <center>

    <div class="text"><p><h1>This is a sample, <br />
   My Name is Matthew<br />Here is <span><a href="http://www.nba.com" >NBA Website</a>.</span><br />This is very simple<br />Here is  <span><a href="http://www.facebook.com" > Facebook!</a>.</span></h1>
</p></div>
</body></html>

康斯坦丁样品
.文本p
{文本对齐:居中;
左边距:自动;
右边距:自动;
左:50%;
}
.文本{
溢出:隐藏;
边缘底部:110px;
}
.文本h1{
颜色:黑色;
字体系列:“footlight mt light”;
字体大小:50px;
-webkit动画名称:淡入;
-webkit动画持续时间:.9秒;
字母间距:-10px;
}
a{文本装饰:无}
.文本h1跨度a{
-webkit转换:0.9s;
颜色:#9C948D;
}
.文本h1:悬停跨度a{
颜色:蓝色;
}
这是一个示例,
我的名字是马修,这是。
这很简单。


编辑:在ie中是否有类似于div块或任何东西来产生类似的效果?

请注意CSS属性的“-webkit”部分。它只适用于webkit浏览器(Chrome+Safari),IE不支持“-webkit”CSS属性

IE10是第一款支持转换的IE。我通常要么忽略旧浏览器中的动画(旧IE经常->旧电脑,所以动画经常是断断续续的)


如果确实需要,那么使用jQuery修补它。缺点是,jQuery中没有内置动画色彩,所以您需要一个插件。

我认为IE 9不支持过渡,是吗?编辑:我希望它看起来像这样,这在IE
-moz-
中适用于Firefox,
-o-
中适用于Opera,
-ms-
中适用于IE。但是IE还不支持过渡或动画(请参阅Rich Bradshaw的答案)。