⼩程序修改按钮button样式:去边框、圆⾓及⽂字居左对齐、修改按钮⾼度
因为有要button和view显⽰的样式相同的需要
所以要去掉按钮的边框,圆⾓,背景⾊,⽂字需要居左对齐,代码如下:
关键是按钮的样式:
怎样开通手机银行1. 去掉边框:
.user-phone-btn::after {
border: none;
乔 布莱恩特}
2. 去掉圆⾓(注意border-radius: 0以下两处都要写):
.user-phone-btn {
border-radius: 0;
}
.user-phone-btn::after {
border-radius: 0;
}
3. 去掉背景:设置背景颜⾊和⽗view背景颜⾊相同即可
4. ⽂字左对齐(要设置margin-lef和padding-left):
.user-phone-btn {
margin-left: 0rpx;
padding-left: 0rpx;
}
5. 修改button⾼度:需要设置line-height属性,值与height设置相同即可,不然按钮中的⽂字显⽰不会居中文言文狼的翻译
具体代码如下:
// .wxml
穿越女尊小说<view wx:if='{{hasBindingPhoneNumber}}' class='user-phone'>123456789012</view>
<button wx:else class='user-phone-btn' open-type="getPhoneNumber" lang="zh_CN" size="{{defaultSize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindgetphonenumber="bindGetPhoneNumber" hover-class="other-button-hov // .js⽂件
Page({
/**
* 页⾯的初始数据
*/
data: {
defaultSize: 'default',
安琪发面一般多长时间disabled: false,
plain: false,
loading: false,
},
})
.user-phone {
color: white;
font-size: 28rpx;
}
.user-phone-btn {
background-color: #FF8EAC;
font-size: 28rpx;
border-radius: 0;
color:white;
margin-left: 0rpx;
padding-left: 0rpx;
height: 60rpx;
line-height: 60rpx;
}
.user-phone-btn::after {
border: none;
赞美松树的诗border-radius: 0;
}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论