啥也不说了,直接上代码。
.top-banner .online-btn {
position: relative;
border: none;
width: 252px;
height: 64px;
border-radius: 10px;
border: solid 2px #f19ec2;
font-size: 24px;
line-height: 64px;
color: #e05780;
text-align: center;
margin-top: 7%;
margin-bottom: 12.6%;
cursor: pointer;
}
.top-banner .online-btn:after,.top-banner .online-btn:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 0;
height: 100%;
background:none;
z-index:-2;
border-radius: 4px;
color: #fff;
}
.top-banner .online-btn:hover{
z-index:1;
background:transparent;
color: #fff;
}
.top-banner .online-btn:before {
transition: .5s;
background: #e05780;
z-index:-1;
color: #fff;
}
.top-banner .online-btn:hover:after,.top-banner .online-btn:hover:before {
width: 100%;
}