<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. python 守护进程,监控进程

    守护进程代码: import time, os import subprocess def run(): while True: taskList = os.popen('tasklist').rea ...

  2. [React] 01 - Intro: javaScript library for building user interfaces

    教学视频: http://www.php.cn/code/8217.html React 教程: http://www.runoob.com/react/react-tutorial.html 本篇是 ...

  3. 升级 Centos 6.5/6.7 的 php 版本

    Centos 6.5/6.7 的 php 预设是用 5.3.3 这个版本号 wget http://dl.fedoraproject.org/pub/epel/6/x86_64/epel-releas ...

  4. 使用WPF Animated GIF实现GIF图片的播放

    这个类库很方便,也很简单:http://wpfanimatedgif.codeplex.com/ 参考博客:http://blog.csdn.net/gqqnb/article/details/721 ...

  5. Linux Platform驱动模型(一) _设备信息

    我在Linux字符设备驱动框架一文中简单介绍了Linux字符设备编程模型,在那个模型中,只要应用程序open()了相应的设备文件,就可以使用ioctl通过驱动程序来控制我们的硬件,这种模型直观,但是从 ...

  6. Log4j2 中format增加自定义的参数

    首先收藏一下log4j2的官网:http://logging.apache.org/log4j/2.x/manual/plugins.html#TypeConverters 对于这种需要,可以使用lo ...

  7. day_10py 简单地名字管理系统

    #!/usr/bin/env/python #-*-coding:utf-8-*- ''' 名字管理系统 做程序迭代,由点到面一点一点来 ''' # 1.打印功能提示 print("=&qu ...

  8. 5:CSS元素类型

    5:CSS元素类型 学习目标 1.元素类型分类依据和元素类型分类 2.元素类型的转换 3.inline-block元素类型的应用 4.置换和非置换元素的概念和应用案例 一.元素类型分类依据和元素类型分 ...

  9. 网络通信协议八之UDP协议详解

    视频传输中使用UDP协议比较多 UDP协议的责任 >>创建进程到进程间的通信(由端口号完成) >>有限的差错控制,出现差错悄悄丢弃报文(注意这点和TCP协议的区别)

  10. ThinkPHP框架 祖辈分的理解 【儿子 FenyeController】继承了【父亲 FuController】继承了【祖辈 Controller】的

    注:系统自带的Controller方法代表的是祖辈 FuController控制器是自定义的,代表父亲... FenyeController控制器就代表着儿子 [儿子 FenyeController] ...