标签:安卓机 input 标签 image 40rpx 避坑 height 微信 position
问题场景:
下图中的显隐密码和验证码均为包裹在 input标签 中的 image标签,
但在开发测试中发现点击不了这俩个image标签,因为是被input标签的padding挡住了。
解决方法:将image标签用position定位定到对应的位置
1、wxml:
<view class="position"> <input class="inputs psw" type="text" value="{{verificationCode}}" bindinput="verificationCodeChange" placeholder="请输入验证码"> </input> <image class="code-img" src="{{codeImg}}" bindtap="getCode"></image> </view>
2、scss:
.position{ position: relative; image { z-index: 10; position: absolute; top: 0; right: 0; padding: 30rpx; width: 40rpx; height: 40rpx; } .code-img { width: 150rpx; height: 70rpx; margin-top: -16rpx; } }
标签:安卓机,input,标签,image,40rpx,避坑,height,微信,position 来源: https://www.cnblogs.com/elevens/p/15911995.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。