小程序
小游戏
企业微信
微信支付
扫描小程序码分享
不管是flex布局还是line-height布局,view在真机上都不能垂直居中,而button可以。但是官方button默认样式又一堆,能不能把view兼容性改好?
2 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
<!-- pages/login/login.wxml -->
<view class='view-table' >
<view class='view-cell' >
<label>帐号</label>
<input type='text' placeholder='请输入会员帐号' ></input>
<label>密码</label>
<input type='password' placeholder='请输入登录密码' ></input>
<button>登录</button>
</view>
/* pages/login/login.wxss */
view{
border: 0px solid red;
width:97%;
height:1200rpx;
padding: auto;
margin: auto;
text-align: center;
vertical-align: middle;
}
.view-table{
display:table;
.view-cell{
display:table-cell;
width:800rpx;
input{
border: 1px solid red;
margin:30px;
height:60px;
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
设置个高度然后line-height写一样可以么?
工具上可行,真机实测还是有差距,button里面就很好
那你把高度不设置固定值,用行高去撑开view看看能不能行。你记得把view边块元素
外框有固定高度的,而且关键是button标签就没有这个问题,不想用button
不太清楚了,等别人看有没有更好的处理方法吧
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
<!-- pages/login/login.wxml -->
<view class='view-table' >
<view class='view-cell' >
<label>帐号</label>
<input type='text' placeholder='请输入会员帐号' ></input>
<label>密码</label>
<input type='password' placeholder='请输入登录密码' ></input>
<button>登录</button>
</view>
</view>
/* pages/login/login.wxss */
view{
border: 0px solid red;
width:97%;
height:1200rpx;
padding: auto;
margin: auto;
text-align: center;
vertical-align: middle;
}
.view-table{
display:table;
}
.view-cell{
display:table-cell;
width:800rpx;
}
input{
border: 1px solid red;
margin:30px;
height:60px;
}
设置个高度然后line-height写一样可以么?
工具上可行,真机实测还是有差距,button里面就很好
那你把高度不设置固定值,用行高去撑开view看看能不能行。你记得把view边块元素
外框有固定高度的,而且关键是button标签就没有这个问题,不想用button
不太清楚了,等别人看有没有更好的处理方法吧