CSS：CSS3的hover动画效果，为什么没有反应呢？
<html><head><styletype="text/css">#box{height:40px;width:40px;border:1pxsolid#000000;...
<html>
<head>
<style type="text/css">
#box{
height:40px;
width:40px;
border:1px solid #000000;
position:relative;
}
.new #box {
-webkit-transition: top 300ms linear;
}
.new #box:hover {
top: 20px;
}
</style>
</head>
<body>
<div id="box"></div>
</body>
</html> 展开
<head>
<style type="text/css">
#box{
height:40px;
width:40px;
border:1px solid #000000;
position:relative;
}
.new #box {
-webkit-transition: top 300ms linear;
}
.new #box:hover {
top: 20px;
}
</style>
</head>
<body>
<div id="box"></div>
</body>
</html> 展开
1个回答
展开全部
因为你的样式名写法问题，.new #box；这个就已经指定了id为box的div外层必须要有一个class为new的div，否则无法调取box这个样式
你要么把.new #box直接写为#box
或者把<div id="box"></div>
改成
<div class="new">
<div id="box"></div>
</div>
最后补充，hover这个伪类在IE6中是不支持的
你要么把.new #box直接写为#box
或者把<div id="box"></div>
改成
<div class="new">
<div id="box"></div>
</div>
最后补充，hover这个伪类在IE6中是不支持的
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
