<title>无标题文档</title><style type="text/css">.a:hov
<title>无标题文档</title><styletype="text/css">.a:hover{background-color:#0CF;-webkit-tran...
<title>无标题文档</title><style type="text/css">.a:hover{background-color: #0CF;-webkit-transition:background-color 3s easy 1s;-moz-transition:background-color 3s easy 1s;-ms-transition:background-color 3s easy 1s;-o-transition:background-color 3s easy 1s;transition:background-color 3s easy 1s;}</style></head><body><div class="a" style="width:200px;height:200px;background-color: #6F0;"></div></body></html>
这代码为什么实现不了transition效果,我是在IE11浏览器试的 展开
这代码为什么实现不了transition效果,我是在IE11浏览器试的 展开
1个回答
展开全部
两个错误:1、transition代码应该放在鼠标覆盖前的样式中;2、easy应该改为ease
下面是我修改后的代码:
<html>
<head>
<title>无标题文档</title>
<style type="text/css">
.a {width:200px;height:200px;background-color: #6F0;-webkit-transition:background-color 3s ease 1s;-moz-transition:background-color 3s ease 1s;-ms-transition:background-color 3s ease 1s;-o-transition:background-color 3s ease 1s;transition:background-color 3s ease 1s;}
.a:hover{background-color: #0CF}
</style>
</head>
<body>
<div class="a"></div>
</body>
</html>
补充说一下,除了Safari浏览器需要webkit前缀,其他浏览器都已直接支持transition属性,所以代码可简化为:
<html>
<head>
<title>无标题文档</title>
<style type="text/css">
.a {width:200px;height:200px;background-color:#6F0;-webkit-transition:background-color 3s ease 1s;transition:background-color 3s ease 1s}
.a:hover{background-color: #0CF}
</style>
</head>
<body>
<div class="a"></div>
</body>
</html>
追问
无标题文档
.a{width:100px;height:100px;background:#3FF;}
.a{-webkit-columns:50px 2;columns:50px 2;}
thjyitojuhroeujoreuioujtoiryhighidoihgsegth
为什么实现不了columns
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询