<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. 解决highCharts导出功能汉化问题

    本文以highCharts中文网上的例子为原型,处理解决highCharts导出功能为英文的问题. 我们使用highCharts当然希望所有提示或文本都是中文的了,但是highCharts的默认语言是 ...

  2. MyBatis Generator使用com.mysql.cj.jdbc.Driver遇到的问题

    MyBatis Generator使用com.mysql.cj.jdbc.Driver Mybatis Generator 1.3.5 新建了一个decision库,并创建了一张user表 impor ...

  3. [Tensorflow] RNN - 04. Work with CNN for Text Classification

    Ref: Combining CNN and RNN for spoken language identification Ref: Convolutional Methods for Text [1 ...

  4. web java -- 连接池 -- 概述

    1. 连接池的实现原理 1. 创建连接池 首先要创建一个静态的连接池.这里的“静态”是指池中的连接时在系统初始化时就分配好的,并且不能够随意关闭.Java 提供了很多容器类可用来构建连接池,例如Vec ...

  5. css3整理--transform

    transform语法: transform : none | <transform-function> [ <transform-function> ]* none为默认值, ...

  6. ubuntu-16.04更好软件源

    author: headsen chen date:2019-03-06  14:01:07 1,修改软件源文件成如下的清华大学的源(亲测可用) root@ubuntu:/var/lib/apt/li ...

  7. MFC从资源加载文本

    bool CWizardSheet::GetTextResource(UINT uID, CString& csContent) { HMODULE hModule=GetModuleHand ...

  8. B - Is It A Tree?

    来源 hdu 1325 A tree is a well-known data structure that is either empty (null, void, nothing) or is a ...

  9. C++设计实现一个不能被继承的类

    C++不同于Java,Java中被final关键字修饰的类不能被继承,C++能实现不被继承的类,但是需要自己实现. 为了使类不被继承,最好的办法是使子类不能构造父类的部分,此时子类就无法实例化整个子类 ...

  10. BZOJ 1150 - 数据备份Backup - [小顶堆][CTSC2007]

    题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=1150 Time Limit: 10 Sec Memory Limit: 162 M De ...