css如何实现鼠标放到按钮上从左往右动画移入[可看示例]

.hot_products_right_nav .hot_products_right_tit{
cursor: pointer;
width: 112px;
height: 35px;
line-height: 35px;
text-align: center;
border: 1px solid #4a8cf6;
float: left;
margin-left: 20px;
font-size: 13px;
position: relative;
color: #4a8cf6;
}
.hot_products_right_nav .hot_products_right_tit:after,.hot_products_right_nav .hot_products_right_tit:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
z-index:-2;
}
.hot_products_right_nav .hot_products_right_tit:hover{
color: #fff;
z-index:1;
background:transparent;
}
.hot_products_right_nav .hot_products_right_tit:before {
transition: all 0.3s;
background: linear-gradient(90deg, #4a8cf6, #2F91FF);
z-index:-1;
}
.hot_products_right_nav .hot_products_right_tit:hover:after,.hot_products_right_nav .hot_products_right_tit:hover:before {
width: 100%;
}

最后

以上就是精明野狼为你收集整理的css如何实现鼠标放到按钮上从左往右动画移入[可看示例]的全部内容，希望文章能够帮你解决css如何实现鼠标放到按钮上从左往右动画移入[可看示例]所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。