这是一个从圆形按钮,渐变到圆头按钮,非常简单
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#sss{
width: 50px;
height: 50px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border: 1px solid red;
margin: 0 auto;
font-size: small;
border-radius: 50px;
transition: all 0.3s linear;
cursor: pointer;
}
#sss:hover{
background-color: red;
color: white;
width: 300px;
}
</style>
</head>
<body>
<div id="sss">登录</div>
</body>
</html>