Question

我是这个整个css的新手，我在我的博客主题上使用了：悬停转换。当我悬停在它上面时，它很流畅，但当我移除鼠标时，淡出过渡不再平滑。这是我的代码：

#box{
   background-color:#333;
   width:200px;
   color: #fff;
   border: 3px solid #e6e6e6;
   margin-top:200px;
   height: 70px;
   margin-left:50px;
   position:fixed;
   padding:20px 10px 20px 10px;
   text-align:center;}

#box:hover{
   height: 200px;
   -webkit-transition: all 0.5s;
   -moz-transition: all 0.5s;}

我的博客预览是here

Answer 1

您应该将过渡属性放在#box而不是#box:hover中，如下所示：

＆＃13;

#box{
   background-color:#333;
   width:200px;
   color: #fff;
   border: 3px solid #e6e6e6;
   height: 70px;
   margin-left:50px;
   position:fixed;
   padding:20px 10px 20px 10px;
   text-align:center;
   -webkit-transition: all 0.5s;
   -moz-transition: all 0.5s;}

#box:hover{
   height: 200px;}

＆＃13;

<div id="box">Text</div>

＆＃13;

顺利淡出过渡不起作用

1 个答案: