CSS 双色拼接按钮效果

    <template>
    	<view class="sss">
    		<button> <!-- 按钮 -->
    			<view class="span"> 按钮 </view> <!-- 按钮文本 -->
    		</button>
    	</view>
    </template>
    <script></script>
    <style>
    	body {
    		background-color: #212121;
    		/* 设置背景颜色 */
    	}

    	.sss {
    		margin-top: 300px;
    		/* 设置上边距 */
    		text-align: center;
    		/* 设置文本居中 */
    	}

    	button {
    		width: 150px;
    		/* 设置按钮宽度 */
    		height: 50px;
    		/* 设置按钮高度 */
    		position: relative;
    		/* 设置相对定位 */
    	}

    	button::before {
    		content: '';
    		/* 设置伪元素内容为空 */
    		position: absolute;
    		/* 设置绝对定位 */
    		z-index: 5;
    		/* 设置层级 */
    		height: 100%;
    		/* 设置高度 */
    		background: #5a189a;
    		/* 设置