1、.wxml(按钮的样式不生效,可删除app.json里的
2、.wxss
"style": "v2"
)<button style="80%;" class='btn1' open-type='openSetting'> <image style="height: 40rpx;" class='btnImg' src='/image/wechat.png'></image> <view>确定</view> </button> <view class="home"> <button class="btn2" bindtap="home"> <view>返回主页面</view> </button> </view>
.btn1 {
80%;
margin-top: 20rpx;
background-color: burlywood;
color: white;
border-radius: 98rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.btnImg {
margin-right: 8rpx;
46rpx;
height: 46rpx;
}
.btn1::after {
border-radius: 98rpx;
border: 0;
/* border-color: red; */
/* border和border-color:red只存在一个(border:0是没有边框的,另一个有边框的) */
}
.home{
100%;
position: fixed;
bottom: 0;
height: 140rpx;
background-color: rgb(255, 255, 255);
border-top:solid 1px #e1e1e1;
}
.btn2 {
85%;
margin-top: 20rpx;
background-color: rgb(0, 0, 0);
color: rgb(255, 255, 255);
border-radius: 98rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
font-size: 26rpx;
height: 82rpx;
font-weight: 500;
margin-top: 30rpx;
}
效果图