<textarea></textarea>
作用:允许用户录入多行数据到表单控件中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<div>
<form action="http://www.baidu.com" method="get">
<div>
自我介绍:
<textarea></textarea>
</div>
</form>
</div>
</body>
</html>

 在文本输入内容

属性说明:

  • name:提交给服务端
  • rows:设置文本区域的列数,变相设置当前元素宽度
  • cols:设置文本区域的行数,变相设置当前元素高度
  • disabled:禁用

设置文本域rows高度,cols宽度

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<div>
<form action="http://www.baidu.com" method="get">
<div>
自我介绍:
<textarea cols="20" rows="5"></textarea>
</div>
</form>
</div>
</body>
</html>

加上name 可以向服务端提交数据 设置默认值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<div>
<form action="http://www.baidu.com" method="get">
<div>
自我介绍:
<textarea cols="20" rows="5" name="text">mike</textarea>
</div>
</form>
</div>
</body>
</html>

加上placehodler属性

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<div>
<form action="http://www.baidu.com" method="get">
<div>
自我介绍:
<textarea cols="20" rows="5" name="text" placeholder="自我介绍"></textarea>
</div>
</form>
</div>
</body>
</html>

前端 HTML form表单标签 textarea标签 多行文本的更多相关文章

  1. Form表单,textarea标签输入框 字数限制,和已输入字数的统计显示

    <script type="text/javascript"> $(document).ready(function() { <%-- 页面进来时就调用 --%& ...

  2. form表单的属性标签

    form表单的常用标签 表单: <form id="" name="" method="post/get" action=" ...

  3. 前端 HTML form表单标签 input标签 type属性 file 上传文件

     加上上传文件功能 input type='file' - 依赖form表单里一个属性 enctype="multipart/form-data" 加上这个属性表示把你上次文件一点 ...

  4. form表单的属性标签和练习

    form表单的标签 做一个如下图的form表单: 我们的代码如下: <body leftmargin="400px" topmargin="200px"& ...

  5. 前端之form表单与css(1)

    目录 一.form表单 1.1表单的属性 1.2input 1.2.1form表单提交数据的两种方式 1.3select标签 1.4label标签 1.5textarea多行文本标签 二.CSS 2. ...

  6. HTML学习笔记 域元素(form表单、textarea文本域、fieldset域集合、input使用) 案例 第四节 (原创)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 前端通过form表单构造带参数url

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. form表单里如果只存在一个文本框,enter键提交

    在这里说一说浏览器里form表单的默认行为 我们都知道浏览器是存在很多默认行为的,可能是出于常用行为考虑又或者是历史原因.但有时候我们不需要这些默认行为.以下: 1).当form表单里只存在一个inp ...

  9. 关于html 中form表单的内标签和使用

    表单标记 1.普通文本框: <input type=”text” name=”名称” value=”值”;不写value默认为空/> 2.密码框:<input type=”passw ...

随机推荐

  1. Spark排序之SortBy

    sortBy函数源码:接收三个参数,第一个参数必须,第二个和第三个参数非必要 def sortBy[K]( f: (T) => K, ascending: Boolean = true, num ...

  2. VS2017 配置ImageMagick

    以下配置仅供参考,我配置完了怎样都用不了... 直接下载源码使用VS进行编译. 源码下载地址:http://imagemagick.org/script/install-source.php#wind ...

  3. ORA-03135 防火墙超时设置断开db link 连接

    [现象] 应用使用数据库连接池,访问A库时通过dblink查询B库,应用时不时会报错ORA. [过程还原] 当应用获取了一个数据库连接,并在数据库连接中使用了dblink,如果应用到A库的连接不释放, ...

  4. 重写 Ext.form.field 扩展功能

    直接代码,放项目overrides文件夹中即可 //重写类 表单父类 //支持allowBlank动态绑定 Ext.define("override.form.field.Base" ...

  5. Ubuntu 基于Docker的TensorFlow 环境搭建

    基于Docker的TensorFlow 环境搭建 基于(ubuntu 16.04LTS/ubuntu 14.04LTS) 一.docker环境安装 1)更新.安装依赖包 sudo apt-get up ...

  6. 数据库高分笔记01:事务ACID

    作者:arccosxy  转载请注明出处:http://www.cnblogs.com/arccosxy/ 事务就是一组原子性的SQL查询,或者说一个独立的工作单元.如果数据库引擎能够成功地对数据库应 ...

  7. day6 六、元组、字典、集合的基本操作和内置方法

    一.元组 1.定义 # 元组tuple # 记录多个值,当值没有改的需求是,建议用元组更好 # 定义:在()内用逗号分开任意类型的值 # name = (, , 300.5]) # print(nam ...

  8. DB2 rollforward 命令使用详解

    DB2 rollforward 命令使用详解 原文:https://www.ibm.com/developerworks/cn/data/library/techarticles/dm-1003wuc ...

  9. python字典查询功能

    def fetch(data): print(' 查询功能') print('用户数据是',data) def add(): pass def change(): pass def delete(): ...

  10. hive优化之调整mapreduce数目

    一.调整hive作业中的map数 1.通常情况下,作业会通过input的目录产生一个或者多个map任务.主要的决定因素有: input的文件总个数,input的文件大小,集群设置的文件块大小(目前为1 ...