ios下 input输入框的蓝色光标 未居中且高度过高

调试时用的是安卓手机,由于安卓input输入框的光标没有ios那么明显,所以一直没有发现这个问题。
产生原因 : 为了保证标题 和 input 框中的文字垂直居中,使用了heigh和line-height,导致整个光标高度变成了输入框的高度。如果不小心将 input 的height 或者 line-height 设置了, 可能就会导致蓝色光标异常显示的情况。

设计稿规则是 : 左侧是标题,input框位于同一行,靠右侧边缘。
思路是 : 由于本来是输入框右浮动,想要垂直居中,就使用了line-height。 现在改变了思路,使整一行靠右显示,将标题设置为浮动,此时就不需要考虑输入框的居中问题了。

// 原代码
 .label { }
.input{
	float : right ;
	height : 40px;
	line-height : 40px;
}
// 最终解决的方法是
.form-item{
	text-align : right
}
 .label { float : left }
.input{
	line-height:20px;
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值