我的pgm的当前输出(红色和绿色圆圈由我编辑以便于理解(红色圆圈内的加号应位于绿色圆圈的位置。
你能帮我做这个吗。。!!提前感谢
我的代码:
.plussymbol{
font-size: 40px;
color: #a4508b;
background-color:transparent;
border-radius: 20px;
border: none;
display: inline-block;
cursor: pointer;
position: absolute;
/*top: 37%;
right: 28%;
*/
padding-top: 15px;
vertical-align: middle;
}
.userip{
width:90%;
height: 65px;
border-radius: 30px;
font-size: 27px;
font-weight: lighter;
font-family: 'Hanalei Fill', cursive;
background-color: #ece7e7;
color: #000;
border: none;
-webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.6);
box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.6);
padding-right: 20px;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css" integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA==" crossorigin="anonymous" />
</head>
<body>
<form>
<input type="text" class="userip" placeholder="Add Today's Task?" autocomplete="on">
<button type="button" class="plussymbol">
<i class="fas fa-plus-square"></i>
</button>
</form>
</body>
</html>
只需这样做即可。
.plussymbol{
font-size: 40px;
color: #a4508b;
background-color:transparent;
border-radius: 20px;
border: none;
display: inline-block;
cursor: pointer;
margin-left: -60px;
}