<!DOCTYPE html>
<html>
<head>
<title>button</title>
<meta charset="utf-8" lang="gb23123">
<style type="text/css">
#btn{
display: block;
width: 100px;
height: 40px;
background-color: lightcoral;
text-align: center;
line-height:40px;
position: relative;
color: #FFF;
font-size: 2em;
margin: 0 auto;
}
#btn::before{
width: 30px;
height: 30px;
border-radius: 30px;
background: #fff;
position: absolute;
display: block;
left: -15px;
top: 5px;
content: "";
}
</style>
</head>
<body>
<buton id="btn">登录</buton>
</body>
</html>
CSS实现矩形按钮左边缘的中间有个往里凹的小半圆
最新推荐文章于 2024-03-06 15:02:53 发布