如何编辑我的代码以使其在 IE 中运行。它在 Firefox 和 Chrome 中运行良好。
我无法找出在 Internet Explorer 中调用 transition
和 animation
的正确属性。
<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>
编辑:是否有像 div block 之类的东西可以在 ie 中产生类似的效果?
最佳答案
IE10 是第一个支持转换的 IE。我通常要么忽略旧浏览器中的动画(旧 IE 经常 -> 旧计算机,因此动画经常断断续续)。
如果确实需要,则使用 jQuery 对其进行修补。缺点是动画颜色没有内置到 jQuery 中,因此您需要一个插件。
关于html - CSS 过渡和动画在 IE 中不工作(在 Firefox/Chrome 中工作),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8580392/