在HTML5中,placeholder是一个非常有用的属性,当控件中无内容时可以代替UI控件的提示功能,而不需要写额外的代码。但如果有一个textarea控件,我们需要多行的文本提示信息时,使用”\n”, “
“均不能实现换行功能;后来在一次无意中的操作,实现了placeholder的换行功能。

placeholder的属性值本身包含格式信息,但不能转义字符(如’\n’, ‘\t’),在编辑器中可直接使用回车实现placeholder的换行功能。如:

<textarea placeholder="If you were a teardrop;In my eye,
For fear of losing you,I would never cry. And if the golden sun,Should cease to shine its light, \t\n
Just one smile from you,Would make my whole world bright."></textarea>

显示效果如下:

测试环境: Google Chrome, Version 40.0.2214.91 (64-bit)

HTML5的placeholder属性如何实现换行的更多相关文章

  1. html5的placeholder属性(IE如何兼容placeholder属性)

    界面UI推荐 jquery html5 实现placeholder兼容password  IE6 html5的placeholder属性(IE如何兼容placeholder属性) 2013-01-05 ...

  2. 让IE下支持Html5的placeholder属性

    HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等. Placeholder 是HTML5新增的另一个属性,当input或者textarea设 ...

  3. 【工作笔记五】html5的placeholder属性(IE如何兼容placeholder属性)

    placeholder属性,IE对其的支持表示无奈,firefox.google chrome表示毫无压力. HTML5对Web Form做了许多增强,比如input新增的type类型.Form Va ...

  4. HTML5之placeholder属性以及如何更改placeholder属性中文字颜色

    今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...

  5. 转: HTML5之placeholder属性以及如何更改placeholder属性中文字颜色

    今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下. 熟悉HTML5的人应 ...

  6. Html5 input placeholder 属性字体颜色修改。

    这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识,需要的朋友可以参考下     Chrome支持input=[type=text]占位文本属性,但下列CSS样式 ...

  7. Html5的placeholder属性(IE兼容)

    HTML5对Web Form做了很多增强,比方input新增的type类型.Form Validation等. Placeholder是HTML5新增的还有一个属性,当input或者textarea设 ...

  8. [干货]兼容HTML5的Placeholder属性-更新版v0.10102013

    HTML5对Web Form做了许多增强,比如input新增的type类型.Form Validation等.Placeholder是HTML5新增的另一个属性,当input或者textarea设置了 ...

  9. 工作笔记之20170223:①关于Html5的placeholder属性,②以及input的outline:none的样式问题

    关于这边几个样式问题,重点有这么几个: (1)placeholder="请输入密码" (2) color:#BEB6B6; border:0px; border-bottom:1p ...

随机推荐

  1. Flash视频播放器开发经验总结

    HTTP协议更优 目前几乎所有的视频点播网站全部采用HTTP协议传输数据.因为相对于诸如RTMP等协议来说,HTTP协议是无状态的,数据传输完毕就断开连接,这样服务器就可以腾出资源来服务更多的用户.而 ...

  2. com学习前提必看

    1) COM组件实际上是一个C++类,而接口都是纯虚类.组件从接口派生而来.我们可以简单的用纯粹的C++的语法形式来描述COM是个什么东西: class IObject { public: virtu ...

  3. BZOJ1002 轮状病毒

    Description 轮状病毒有很多变种,所有轮状病毒的变种都是从一个轮状基产生的.一个N轮状基由圆环上N个不同的基原子和圆心处一个核原子构成的,2个原子之间的边表示这2个原子之间的信息通道.如下图 ...

  4. badge ionic tab

    我需要在tab上动态显示 badge badge="badges.carts" badge-style="badge-assertive" 将这段代码 放在了 ...

  5. 深入浅出Nodejs读书笔记(转)

    Node简介 这一章简要介绍了Node,从中可以了解Node的发展历程及其带来的影响和价值. 为什么叫Node?起初,Ryan Dahl称他的项目为web.js,就是一个Web服务器,但是项目的发展超 ...

  6. css3为图片添加鼠标移入放大效果

    只需要为添加效果的图片定义一个伪类 img.zoom-img:hover { -webkit-transform: scale(1.15); -webkit-transition-timing-fun ...

  7. 条款19 command 模式与好莱坞法则

    当一个函数对象被当做回调时候,就是一个command模式的实例 什么是回调? 回调就是框架知道什么时候干一些事情,但是具体干什么,或许框架一无所知(因为回调函数不是他设计的),而用户则知道发生一个特定 ...

  8. 必须会的SQL语句(八)数据库的完整性约束

    实体完整性 1.建表时定义主键   Create table 表名    (         Sno int identity(1,1),         Sname nvarchar(20),    ...

  9. wp8.1 全球化解决办法

    最近在更新一个应用,在wp8.1里面重写整个应用,由于8.1版本的api.架构和windows8.1的接口高度相同,变化很大,在编码过程中,只能一边翻msdn资料一边摸索解决遇到的问题,其中程序标题和 ...

  10. Cadence仿真利器,Cadence SI / PI Analysis – Sigrity安装及破解指南

    Sigrity提供了丰富的千兆比特信号与电源网络分析技术,包括面向系统.印刷电路板(PCB)和IC封装设计的独特的考虑电源影响的信号完整性分析功能. Sigrity分析技术与Cadence Alleg ...