修改 placeholder 样式,placeholder 换行 以及iOS 上设置placeholder被遮挡

修改placeholder样式
/*通过选择器就可以简单的修改该placeholder的样式*/
input::placeholder{
    font-size:14px;
    color: #666666;
}
placeholder 换行

在input 里面很少用到,input 就只有一行而已,多行的话就会使用textarea标签,确实在textarea标签里面如何让placeholder 换行是一个麻烦事,由于不同浏览器兼容性还不一样.
这里提供一个简单的实现方法
jq_watermark,一个基于jQuery的小插件,min版本才2.8KB
使用方式
导入jQuery,导入jq_watermark, jq_watermark在github上的下载地址
给textarea 加上名为 jq_watermark 的class

    <textarea name="" class="jq_watermark" cols="110" rows="10" required placeholder="第一行<br/>第二行<br/>第三行"></textarea>
ios上的小坑

在苹果高版本上,iPhone6,7 上发现了一个小问题,就是当你设置placeholder显示的字体大小的时候,有时候会被遮挡掉一部分,这时候怎么解决?
解决方法:先设置input 里面的字体大小需要大于placeholder的字体大小^-^

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值