ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

创建文本区域

2020-12-04 12:57:51  阅读:140  来源: 互联网

标签:textarea 换行 创建 区域 规定 文本 属性


第1关:textarea控件相关概念
任务描述
本关任务:完成一组有关textarea控件的概念题。
相关知识
为了完成本关任务,你需要掌握:textarea标签及其属性
textarea标签的属性
textarea标签用于定义多行文本区域,文本区域中可容纳无限数量的文本,其中文本的默认字体是等宽字体(Courier)。
textarea的基本属性
textarea的基本属性主要有:
cols:规定每行中的字符数
rows:规定可见的行数
name:规定文本区域的名称
readonly:规定文本区域为只读
disabled:规定文本区域为不可用
HTML5中textarea的新属性
textarea的新属性主要有:
wrap:规定表单提交时,文本区域的文本换行模式。取值为soft表示不换行,取值为hard表示换行
maxlength:规定文本区域的最大字符数
placeholder:规定一个简短的提示,描述文本区域期望的输入值
required:规定文本区域是必需的/必填的。
autofocus:规定当页面加载时,文本区域自动获得焦点
form:定义文本区域所属的一个或多个表单。
开始你的任务吧,祝你成功!
参考答案:
在这里插入图片描述
在这里插入图片描述
第2关:创建文本域
任务描述
本关任务:完成创建文本域的任务。
效果如下:
在这里插入图片描述
相关知识
为了完成本关任务,你需要掌握:textarea控件及其属性
文本域的设置
在textarea标签中,使用cols属性来规定文本域中每行的字符数,使用cols属性来规定文本域中每行的字符数,使用rows属性可规定文本域中可见的行数,使用name属性可规定文本域的名称,使用wrap属性可规定表单提交时,文本区域的文本换行模式。添加required属性可规定文本域的内容必填写。
示例如下:

推荐理由:<textarea name="userName" cols="40" rows="4" wrap="hard" required="required"></textarea>

效果如下:
在这里插入图片描述
编程要求
请在右侧编辑器中的Begin - End区域内补充代码,具体要求是:
1.创建一个文本域
2.文本域的名称为“reason”
3.文本域中可见行数为为6,每行50个字符
4.文本域内容必须填写
5.表单提交时,文本显示区中的文本在行尾要自动换行
测试说明
补充代码后,请点击测评,平台会对你编写的代码进行测试,如果正确则完成闯关任务。
越努力越幸运,祝你成功!
参考代码

<!DOCTYPE html>
<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置文本域</title>
  </head>
  <body>
   <form action="" method="post">
     请输入你选择本专业的理由:<br/>
    <!-- ********* Begin ********* -->
     <textarea name="reason" cols="50" rows="6" wrap="hard" required="required"></textarea>
    <!-- ********* End ********* -->
     <br/>
     <input type="reset" value="重置">
     <input type="submit" value="提交">
  </body>
</html>

标签:textarea,换行,创建,区域,规定,文本,属性
来源: https://blog.csdn.net/m0_47174730/article/details/110633020

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有