小DEMO：css制作圆滑梯形按钮

代码：

<div class="pull-btn-box">
	<div class="pull-btn">
		<svg width="12" height="12">
			<path d="M0 0 L6 11 L12 0" stroke="#A6A6A6" stroke-width="2" fill="none"/>
	    svg>
	div>
div>

.pull-btn-box {
	position: absolute;
	top: 1px;
	left: 50%;
	transform: translate(-50%, -100%);
	.pull-btn {
		cursor: pointer;
		position: relative;
		border: 2px solid #D8D8D8;
		border-radius: 10px 10px 0 0;
		width: 84px;
		height: 45px;
		background-color: white;
		transform-origin: center bottom;
		transform: perspective(80px) rotateX(50deg);
		border-bottom: none;
		display: flex;
		align-items: center;
		justify-content: center;
		img {
			width: 18px;
		}
		&::before {
			content: '';
			position: absolute;
			width: 10px;
			height: 10px;
			bottom: 0;
			left: -10px;
			background: radial-gradient(circle at 0 0, transparent 8px 0, #D8D8D8 8px 0, #D8D8D8 10px 0, white 10px 0,);
		}
		&::after {
			content: '';
			position: absolute;
			width: 10px;
			height: 10px;
			bottom: 0;
			right: -10px;
			background: radial-gradient(circle at 100% 0, transparent 8px 0, #D8D8D8 8px 0, #D8D8D8 10px 0, white 10px 0,);
		}
	}
}