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

原创 2017年08月14日 23:11:18

修改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的字体大小^-^

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_29594393/article/details/77171214

placeholder中实现换行

html控件中如何实现在placeholder中换行提示。因为在placeholder不会解析html代码,所以用换行符 <br/>和 /r/n 等都没有作用。我们可以用用转义字符代替<br/>。 ...
  • yiyelanxin
  • yiyelanxin
  • 2018-01-09 09:31:44
  • 368

iOS开发 - 设置placeholder无效?

平日里设置placeholder并没有注意过,近日发现设置的placeholder颜色没了,查证后才发现,并不是方法无效了,而是位置关系:[textField setValue:[UIColor or...
  • CodingFire
  • CodingFire
  • 2016-11-30 10:24:31
  • 1557

iOS占位文字placeholder设置技巧

@interface BSPublishTextView : UITextView /** 对外属性占位字符 placeholder */ @property (nonatomic, copy) ...
  • cybtop
  • cybtop
  • 2017-07-29 11:44:51
  • 288

iOS UITextField自动换行

在网上查了一下,UITextField没有自动换行的代码,所以呢,我就用了一种相对 liu mang的方式实现了一下,但是也有不足,光标无法移动,(其实根本就没有光标。。。(⊙﹏⊙)b) 如果大家有...
  • u012661893
  • u012661893
  • 2016-08-11 15:54:37
  • 15308

input框的placeholder使用line-height在Safari上不垂直居中的问题

测试中出现的问题,Safari5.1.7  input文本框有placeholder值时,css样式设置 line-heigh t与 heigh t等高,并不能使提示文本垂直居中,如下: ...
  • u012076852
  • u012076852
  • 2016-07-29 11:09:05
  • 6724

Placeholder如何换行

使用js动态添加标签充,处理换行问题 1 var placeholder = 'This is a line \nthis should be a new line'; 2 ...
  • sujuan0709
  • sujuan0709
  • 2017-06-07 14:16:56
  • 1082

用PlaceHolder加控件换行

 .net 2005动态加控件的时候,第一个想到的是PlaceHolder,在PlaceHolder中动态添加控件。添加控件的过程很简单,无非就是先定义一个控件,然后通过PlaceHolder.Con...
  • hunlovezhen
  • hunlovezhen
  • 2008-02-25 17:02:00
  • 618

input placeholder在iOS中不显示

问题描述:input placeholder在浏览器中显示,在iOS中不显示。解决方案:input::-webkit-input-placeholder{ font-size:50px; } inpu...
  • tao_sheng_yi_jiu
  • tao_sheng_yi_jiu
  • 2017-12-29 14:59:06
  • 310

iOS开发 - placeholder偏上的问题

[_phoneNum setValue:[UIFont systemFontOfSize:13] forKeyPath:@"_placeholderLabel.font"]; [_phoneN...
  • CodingFire
  • CodingFire
  • 2017-02-06 15:34:06
  • 1184

解决UITextField中placeholder和text文本同时显示的问题

这个问题得来的非常怪异,它只在我的一个项目中存在,我事后尝试多次都无法复现: 图中多处TextField都使用了placeholder属性,但在代码中又设置了text属性,因此ViewControl...
  • kmyhy
  • kmyhy
  • 2015-11-02 14:01:25
  • 4223
收藏助手
不良信息举报
您举报文章:修改 placeholder 样式,placeholder 换行 以及iOS 上设置placeholder被遮挡
举报原因:
原因补充:

(最多只允许输入30个字)