HTML <textarea> 标签的 wrap 属性

wrap 属性

通常情况下，当用户在输入文本区域中键入文本后，浏览器会将它们按照键入时的状态发送给服务器。只有用户按下 Enter 键的地方生成换行。

如果您希望启动自动换行功能（word wrapping），请将 wrap 属性设置为 virtual 或 physical。当用户键入的一行文本长于文本区的宽度时，浏览器会自动将多余的文字挪到下一行，在文字中最近的那一点换行。

wrap="virtual" 将实现文本区内的自动换行，以改善对用户的显示，但在传输给服务器时，文本只在用户按下 Enter 键的地方进行换行，其他地方没有换行的效果。

wrap="physical" 将实现文本区内的自动换行，并以这种形式传送给服务器，就像用户真的那样键入的。因为文本要以用户在文本区内看到的效果传输给服务器，因为使用自动换行是非常有用的方法。

如果把 wrap 设置为 off，将得到默认的动作。

例子

以下面这个例子为例,将 60 个字符的文本输入到一个 40 个字符宽的文本区域内：

word wrapping is  a feature that makes life easier for users.

如果设置为 wrap="wrap"，文本区会包含一行文本，用户必须将光标移动到右边才能看到全部文本，这时将把一行文本传送给服务器。

如果设置为 wrap="virtual"，文本区会包含两行文本，并在单词 "makes" 后面换行。但是只有一行文本被传送到服务器：没有嵌入新行字符。

如果设置为 wrap="physical"，文本区会包含两行文本，并在单词 "makes" 后面换行，这时发送给服务器两行文本，单词 "makes" 后的新行字符将分隔这两行文本。

转载于:https://www.cnblogs.com/ryanchancrj/p/6274608.html

HTML textarea 标签的 wrap 属性相关推荐

ios下多行文本输入框bug，textarea标签的maxlength属性在ios上计算
描述问题: textarea多行文本输入在ios上的bug 问题原因: textarea标签的maxlength属性在ios上计算有问题,ios的换行会占用两个字符.如下:ios换行(\n)其实是占用 ...
【web】textarea标签的cols属性失效，解决办法
经过一系列的测试我发现textarea标签如果放在设置了弹性布局且主轴设置为垂直方向时, textarea标签的cols属性会失效,父容器有多宽textarea的文本框就有多宽还不知道是什么原因 ...
HTML中的多行输入框：textarea标签、cols属性、rows属性。
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>下拉列 ...
HTML textarea 标签
定义和用法 <textarea> 标签定义多行的文本输入控件. 文本区中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier). 可以通过 cols 和 rows ...
HTML标签和说明属性
HTML  注释标签标签定义及使用说明所有主流浏览器都支持  注释标签.  注释标签用来在源文档中插 ...
textarea标签
标签定义及使用说明 <textarea> 标签定义一个多行的文本输入控件. 文本区域中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是 Courier). 可以通过 cols ...
Html5和Css3的基础标签及常用属性
H5 H5的常用标签及属性: 新增和废弃新增的结构(布局) 标签:section.artcle.nav.footer.header.hgroup.Aside.figure 新增的其他标签: Vide ...
html 设置textarea字体颜色,textarea标签设置值
html中怎样给textarea赋值 jquery给textarea赋值的方法跟普通input一样. 举例说明,有如下代码: $("" + "").append ...
input的type属性和textarea标签
input的type属性 type的值和描述以下我只列举了text的类型和submit类型 button 定义可点击按钮(多数情况下,用于通过 JavaScript 里的事件). checkbox ...

HTML textarea 标签的 wrap 属性

HTML <textarea> 标签的 wrap 属性

wrap 属性

例子

HTML textarea 标签的 wrap 属性相关推荐

最新文章

热门文章