如何设置或者改变placeholder的默认样式并且改变苹果手机input光标与input标签等高的问题

input标签的placeholder有默认的样式,但是也是可以修改的,可以修改各种样式,颜色,字体大小,行高等等,修改样式如下:

input::-webkit-input-placeholder { /* WebKit browsers */

font-size: 16px;

}

input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

font-size: 16px;

}

input::-moz-placeholder { /* Mozilla Firefox 19+ */

font-size: 16px;

}

input:-ms-input-placeholder { /* Internet Explorer 10+ */

font-size: 16px;

}

苹果手机跟安卓手机不太一样,苹果手机的光标大小,是跟行高有关的,如果,input的height为40px,其line-height也是40px,则,苹果手机的输入框光标会从input标签的上边框到下边框,安卓手机没有这种状况,这不是我们想要的,因此,我们常用的改变苹果手机的光标高低的方式,是通过上下padding与line-height结合使用,比如:input的height为40px;想让光标高低为20px。则可以padding:10px 0;line-height:20px;则可以解决这个问题的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1 92
  • 不会用代码框,所以看着有些乱套,,,,html部分 <!DOCTYPE html> 迅雷看看 ...
    这就是个帅气的名字阅读 1,562评论 0 0
  • 早上起来刷牙,回想起这两天的过程,觉得像小时候家里办喜酒一样,起初的满怀期待,到来时心生欢喜,结束后的失之泰然,...
    鱼羊ll阅读 485评论 0 0
  • 文/唐露 “千万记住,艺伎不是妓女,也不是别人的妻子,我们卖艺,但不卖身。我们营造一个神秘的世界,一切美不胜收。艺...
    唐露阅读 16,879评论 60 239