正在微力学习的学渣
正在微力学习的学渣

Web程序设计基础头歌edu实训(2023TYUT)

Web前端开发概述

第1关：Web前端开发相关的概念

1、所有的浏览器对同一个CSS样式的解析都相同，因此页面在不同浏览器下的显示效果完全一样。
错
2、URL（英文Uniform Resource Locator的缩写）中文译为“统一资源定位符”。URL其实就是Web地址，俗称“网址”。
对

3、HTTP”是一种详细规定了浏览器和万维网服务器之间互相通信的规则。
对

4、下列选项中，（ ）不是Web浏览器
Linux

5、张同学正在家里通过拨号上网访问新浪主页，此时，他自己的计算机是（ ）。
浏览器

第2关：第一个html网页

DOCTYPE html>
<html>

 <head>
  <meta charset="utf-8"/>
  <title>我的第一个网页title>
 head>
 <body>
  <h1 align="left">初识HTMLh1>
 body> 

html>

web编程训练-html5-文档头部

第1关：页面标题及字符集的设置

DOCTYPE html>
<html>
 <head>
  
  <title>设置标题title>
  <meta charset="utf-8"/>
  
  
  
  
 head>
 <body>
  <h1 align="center">元信息的设置h1>  
 body> 
html>

第2关：元信息的设置

DOCTYPE html>
<html>
 <head>
    <title>设置标题title>
  <meta charset="utf-8"/>
  
  <meta http-equiv="refresh"  content="10;url=https://www.baidu.com/"/> 
  <meta http-equiv ="expires"  content="Fri,31 Dec 2021 08:00:00 GMT"/> 
  <meta name="keywords" content="前端,元信息,网页跳转,失效期,搜索关键词"/> 
  
 head>
 <body>
  <h1 align="center">元信息的设置h1>  
 body> 
html>

第3关：link标签

DOCTYPE html>
<html>
 <head>
    <title>设置标题title>
  <meta charset="utf-8"/>
  
  <link rel="stylesheet" type="text/css" href="https://www.educoder.net//api/attachments/2306844" />
  
 head>
 <body>
  <h1 align="center">元信息的设置h1>  
 body> 
html>

web知识训练-html5文档头部标签及属性

第1关：web知识训练-html5文档头部标签及属性

1、在HTML中，网页标题文字应放置在（ ）
标记之间

2、关于title标签的用法，下列说法正确的是（ ）。
title标签设置的标题可作为默认快捷方式或收藏夹的名称

3、下列link标签的属性中，（ ）可用于指定当前文档与引用的外部文档的关系。
rel

4、如果设置页面刷新、失效期等元信息，可对meta标签添加相应的name属性。
错误

5、包含在头部标签之间的内容不会在浏览器窗口中显示出来。
正确

web知识训练-html5-文本控制类标签

第1关：web知识训练-html5-文本控制类标签

1、在下列选项中，显示内容的大小和浏览器默认文本的大小基本相同的是（ ）。
h4

2、在下列选项中，用于产生一条水平线的标签是（ ）。
hr

3、关于标签的嵌套，下列选项中正确的是（ A ）。

4、标签作用的元素将以上标形式显示。
错误

5、标签作用的元素会以黄色背景效果显示。
正确

web编程训练-html5-文本控制类标签

第1关：html5-网页背景及标题段落标签

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
   <title>标题段落的设置title>
 head>
 
 <body background="https://data.educoder.net/api/attachments/2308369">
   <h1 align = "center">第一章 HTML5基础h1>
   <h2 align = "left">1.1 文本控制标签h2>
   <p align = "justify">这是第1个段落。p>          
 body>
 
html>

第2关：html5-水平线和换行的设置

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
   <title>水平线的设置title>
 head>
 <body background="https://www.educoder.net/api/attachments/2308369">
    <h1 align="center">第一章 HTML5基础h1>
    
   <hr size = 3 width = 400 color = blue noshade align="center">
    <br/>   
    
    <h2 align="left">1.1 文本控制标签h2>
    <p align="justify">这是第1个段落。p>             
 body>
html>

第3关：html5-文本修饰

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
   <title>水平线的设置title>
 head>
 <body background="https://www.educoder.net/api/attachments/2308369">
    <h1 align="center">
       
       
      <font face = "黑体" color = red>第一章 HTML5基础font>  
         
       
    h1>
       <hr size=3  width=400  Align=center color=blue noshade/>
       <br/>    
    <h2 align="left">1.1 文本控制标签h2>
     
       <b>这是加粗显示的文字b>
       <i>这是斜体显示的文字i>
       <u>这是带下划线的文字u>
       <sup>3sup>
       <sub>2sub>    
     
 body>
 html>

web编程训练-html5-图像的运用

第1关：新媒体新闻网页的设计

doctype html>
<html><head>
<meta charset="utf-8">
<title>新媒体新闻网页的设计title>
head>

<body background="https://www.educoder.net/api/attachments/2308369"> 
	
    <h2 align = "center"><font face = "微软雅黑">新媒体的大势所趋font>h2>
	<p align = "center"><font color = "#979797" size = 2>更新时间：2021年11月18日14时08分 来源：<font color = blue>开源社区font>font>p>
    	
    <hr size = 2 color = "#CCCCCC">>
	<p>近年来，随着<font color = blue>移动互联网font>的火爆，公众号、微博、今日头条、抖音等一大批社交平台的火爆带动了新媒体运营行业的发展，运营人在企业中的价值也不断的被放大和受到重视，很多企业在做线上这块时都会考虑<font color = blue>“两微一抖”font>，也就是我们所说的新媒体+短视频运营。因此也就催生了大量对新媒体+短视频运营人的需求岗位。p>
    
body>

html>

第2关：带插图的新媒体新闻网页的设计

doctype html>
<html>
<head>
<meta charset="utf-8">
<title>新媒体新闻网页的设计title>
head>
<body background="https://www.educoder.net/api/attachments/2308369">
	
	<h2 align="center"><font face="微软雅黑">新媒体的大势所趋font>h2>
	<p align="center"><font color="#979797" size="2">更新时间：2021年11月18日14时08分 来源：<font color="blue">开源社区font>font>p>
	<hr size="2" color="#CCCCCC" />
	<p>
     
     <img src="https://www.educoder.net/api/attachments/2334243" title="这是一张插图" width="150" height="100" align = "left" hspace = 30 alt="新媒体插图">   
     
        近年来，随着<font color="blue">移动互联网font>的火爆，公众号、微博、今日头条、抖音等一大批社交平台的火爆带动了新媒体运营行业的发展，运营人在企业中的价值也不断的被放大和受到重视，很多企业在做线上这块时都会考虑<font color="blue">“两微一抖”font>，也就是我们所说的新媒体+短视频运营。因此也就催生了大量对新媒体+短视频运营人的需求岗位。p>	         
body>
html>

web知识训练-html5-图像的运用

第1关：web知识训练-html5-图像的运用

1、下列选项中，不适合作网页图像的文件格式是（ ）。
bmp

2、如果想为网页添加背景图，可在body标签中添加（ ）属性。
background

3、下列选项中，哪个不是相对路径的表示方式（ )。
c：/pic/images/ch_cook1.gif

4、title属性用于设置网页标题。
错误

5、下列选项中，哪个不是img标签的属性（ ）。
href

web编程训练-html5-超链接的应用

第1关：创建热字超链接

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接title>
 head>
 <body>
   
  <h2><a href="https://www.kuwo.cn/">听音乐找酷我a>h2>
   
 body> 
html>

第2关：创建热图超链接

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接title>
 head>
 <body>
 <h2><a href="https://www.kuwo.cn/">听音乐找酷我a>h2>
   
 <a href="https://www.kuwo.cn/"   target="_blank" title="单击进入">
<img src="https://www.educoder.net/api/attachments/2357951" align = "bottom"/>
a> 
    
   
   好音质用酷我
 body> 
html>

第3关：下载歌曲超链接

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接title>
 head>
 <body>
 <h2><a href="http://www.kuwo.cn/">听音乐找酷我a>h2>
  <a href="http://www.kuwo.cn/"><img src=https://www.educoder.net/api/attachments/2357951  align=bottom />a>
  好音质用酷我<br/>
   
  推荐下载：  
  <a href="https://www.educoder.net/api/attachments/2364090" title="下载班得瑞钢琴曲-安妮的仙境">安妮的仙境a>
   
  <p><h2>在线播放：h2><audio src="https://www.educoder.net/api/attachments/2364090" controls="controls">audio>
  p>
 body> 
html>

第4关：创建页内超链接

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建超链接title>
 head>
 <body>
 <h2><a href="http://www.kuwo.cn/">听音乐找酷我a>h2>
  <a href="http://www.kuwo.cn/"><img src=https://www.educoder.net/api/attachments/2357951  align=bottom />a>
  好音质用酷我<br/>
   
   <h2><a href="#Q">查看第7个音频a>h2>
   
  推荐下载：  
  <a href="https://www.educoder.net/api/attachments/2364090" title="下载班得瑞钢琴曲-安妮的仙境">安妮的仙境a>
  <p><h2>在线播放：h2><audio src="https://www.educoder.net/api/attachments/2364090" controls="controls">audio>
  p>
	 <h2>这是第1个音频h2>
     <h2>这是第2个音频h2>
     <h2>这是第3个音频h2>
     <h2>这是第4个音频h2>
     <h2>这是第5个音频h2>
     <h2>这是第6个音频h2>
     <h2>
    
       <a href="Q">这是第7个音频a>
    
     h2>
     <h2>这是第8个音频h2>
 body> 
html>

web知识训练-html5-超链接的应用

1、在HTML中，下面是超链接标签的是（ A ）。

2、下列选项中，用于设置超链接链宿路径的属性是（ ）。
href

3、在HTML中，若点击超链接时，弹出一个新的网页窗口，下列选项符合要求的是（ C ）。

4、所表示的意义是（ ）。
表示空链接，不做任何跳转

5、如果要在超链接中设置电子邮件链接，则href属性值可设置为（ ）
mailto:[email protected]

html5-表格基本结构

第1关：网页表格的基本概念

1、定义表格的项目表头的HTML标签是（ D ）。

2、下列选项中，用于设置表格背景颜色的属性是（ B ）。

3、要使表格的行高为18px，以下方法中，正确的是（ C ）

4、下列选项中，用于设置表格标题的标签是（ D ）

5、下列设置单元格中文本对齐方式的选项中，正确的是（ B ）

第2关：创建简单的表格

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建表格title>
 head>
 <body>
   
  <table border="4px" width = 200 background = "https://www.educoder.net/api/attachments/1208912">
    <caption>成绩表caption>
    <tr width = 100>
      <th width = 100>姓名th>
      <th width = 100>成绩th>
    tr>
    <tr width = 100>
      <td width = 100>张三th>
      <td width = 100>90th>
    tr>
  table>
  
   
 body> 
html>

第3关：表格行样式的设置

DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>表格行样式的设置title>
head>
<body>
    <table border="4px" background="https://www.educoder.net/api/attachments/1208912" width="200">
       <caption>成绩表caption>
       
        <tr height = 40 align = "center" bgcolor = "00ffff" valign = "middle">
       
            <th width="100">姓名td>
            <th width="100">成绩td>
        tr>
        <tr>
            <td>张三td>
            <td>90td>
        tr>
    table>
    
body>
html>

第4关：表格中单元格样式的设置

DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>表格单元格样式的设置title>
head>
<body>
    
    <table border = "4px" cellspacing = "0" width = 200 cellpadding = "8">
    
       <caption>成绩表caption>
        <tr height=40 align=center  valign=middle bgcolor=00ffff>
            <th>姓名th>
            <th>成绩th>
        tr>
        <tr bgcolor=00ff00>
            
            <td width = 120>张三td>
            <td align = "center">90td>
            
        tr>
    table>   
body>
html>

html5—表格高级样式的设置

第1关：表格高级样式设置相关概念

1、下列选项中，用于设置表格内部边框线显示的属性是（ ）。
rules

2、如果希望表格的外部边框只显示上下两条边框线，属性frame的取值应选（ ）。
hsides

3、如果希望表格的内部边框只显示行线，则属性rules的取值应选（ ）。rows

4、HTML中，若合并两个水平方向单元格，应使用的属性是（ ）。
colspan

5、

，表示（ ）
只显示列与列之间的分隔线

第2关：设置表格的外边框样式

<html>
 <head>
  <meta charset="utf-8"/>
  <title>设置表格外边框属性title>
 head>
  <body>
   
   <table width = 100 height = 80 border = 4 frame = "hsides">
   
    
    <caption>简易信息表caption> 
    <tr align=center  valign=middle>
      <th>姓名th>
      <th>年龄th>
    tr>
    <tr  align=center  valign=middle>
      <td>张三td>
      <td>20td>
    tr>
   table>
  body> 
html>

第3关：设置表格的内边框样式

<html>
 <head>
  <meta charset="utf-8"/>
  <title>设置表格内边框属性title>
 head>
  <body>
   
   <table width = 100 height = 80 border = "4" frame = "hsides" rules = "rows">
   
    
    <caption>简易信息表caption> 
    <tr align=center  valign=middle>
      <th>姓名th>
      <th>年龄th>
    tr>
    <tr  align=center  valign=middle>
      <td>张三td>
      <td>20td>
    tr>
   table>
  body> 
html>

第4关：表格中单元格的合并

DOCTYPE html>
<html>
 <head>
    <meta charset="UTF-8">
    <title>签到表title>
    <style type="text/css">
       th{background-color:#00ff33;}
       td{background-color:#00ffff;}
    style>
 head>
 <body> 
    <table border="2" width="400" bordercolor="#00ff00" cellpadding="6">
        <caption>签到表caption>
      
      <tr>
         <th rowspan="2">姓名th>
         <th colspan="2">签到th>
         <th rowspan="2">备注th>
      tr>
      <tr>
         <th>第1次th>
         <th>第二次th>
      tr> 
      <tr>
         <td>张三td>
         <td>td>
         <td>td>
         <td>td>
      tr> 
      
    table>   
 body>
html>

第5关：表格的综合案例

DOCTYPE html>
<html>
 <head>
    <meta charset="UTF-8">
    <title>表格综合title>
    <style type="text/css">
       th{background-color:#00ff33;}
       td{background-color:#00ffff;text-align:center}
       caption{font-family:黑体;font-size:30px;color:blue}
    style>
 head >

<body background="https://www.educoder.net/api/attachments/1217848">
   <table border = "2" width = 600 bordercolor = "#00ff00" cellpadding = 6 align = "center">
      <caption>家庭账单caption>
      <tr>
         <th colspan="2" rowspan="2">本周项目th>
         <th colspan="2">费用明细th>
         <th rowspan="2">备注th>
      tr>
      <tr>
         <th>收入th>
         <th>支出th>
      tr>
      <tr>
         <th rowspan="3">收入th>
         <th>工资th>
         <td>10000td>
         <td>0td>
         <td>td>
      tr>
      <tr>
         <th>兼职th>
         <td>2000td>
         <td>0td>
         <td>td>
      tr>
      <tr>
         <th>收入合计th>
         <td>12000td>
         <td>0td>
         <td>td>
      tr>
      <tr>
         <th rowspan="3">支出th>
         <th>生活用品th>
         <td>0td>
         <td>4000td>
         <td>td>
      tr>
      <tr>
         <th>学杂费th>
         <td>0td>
         <td>3000td>
         <td>td>
      tr>
      <tr>
         <th>支出合计th>
         <td>0td>
         <td>7000td>
         <td>td>
      tr>
   table>
body>      

html>

表单的结构

第1关：表单的基本概念

1、下列选项中，不属于表单标记的常用属性的是（ ）。
size

2、在HTML中，，method属性表示（ ）。
提交方式

3、在HTML中，（ ）标签用于在网页中创建表单。

4、在表单提交方式中，get方式的保密性好，并且无数据量的限制。
错误

5、在HTML中，要创建一个名为“myform”的表单，以get方式向服务器发送，表单提交后，执行程序的地址为passwodl.jsp，下面创建表单的代码中，正确的是（ ）。
…

第2关：学会设置action和method属性

DOCTYPE html>
<html>
<body>
    
<form name="selectForm" method="post" action="myselect.jsp">
    
  <select size="1">
   <option value="JZ">橘子option>
   <option value="PG">苹果option>
   <option value="XJ">香蕉option>
   select>
  form>
body>
html>

创建输入控件

1、在表单中插入单选按钮的HTML代码是（ ）。

2、HTML代码表示（ 　）。
创建一个单行文本输入区域

3、对于标签，如果希望实现密码框效果，* 值是（ ）。
password

4、下列选项中，用于设置input控件在首次加载时为禁用的属性是（ ）。
disabled

5、设置表单中密码框的最大长度为15正确的属性设置是（ ）
maxlength=15

第2关：创建文本框

<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置单行文本框title>
  head>
  <body>
   <form>
      姓名：
   
       <input type="text" name ="yourname" size = "15" maxlength="5">
      
   form>
  body>
html>

第3关：创建密码框

<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置密码框title>
  head>
  <body>
   <form>
      姓名：
      <input type="text" name="yourname" size="15" maxlength="5"/>
      <br>
      密码：
    
      <input type="password" name="yourpassword" size="15" value="12345"> 
    
   form>
  body>
html>

第4关：创建单选按钮

DOCTYPE html>
<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置单行文本框title>
  head>
  <body>
   <form action=""method="post">
     姓名：<input type="text" name="yourname" size="15" maxlength="5"/><br/>
     密码：<input type="password" name="password" size="15" value="12345"/><br/>
     国庆期间你最喜欢看的电影？<br/>
    
     <input type="radio" name = "Film" value="Film1">夺冠
     <input type="radio" name = "Film" value="Film2">我和我的祖国
     <input type="radio" name = "Film" value="Film3">姜子牙
     
        
    
   form>
  body>
html>

第5关：创建复选框

DOCTYPE html>
<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置单行文本框title>
  head>
  <body>
   <form action=""method="post">
     姓名：<input type="text" name="yourname" size="15" maxlength="5"/><br/>
     密码：<input type="password" name="password" size="15" value="12345"/><br/>
     国庆期间你最喜欢看的电影？<br/>
     <input name="Film" type="radio" value="Film1"/>夺冠
     <input name="Film" type="radio" value="Film2"/>我和我的祖国
     <input name="Film" type="radio" value="Film3"/>姜子牙<br/>
    你喜欢的运动是？<br/>
    
     <input type="checkbox" name="Sports" value="sport1" checked>打篮球
     <input type="checkbox" name="Sports" value="sport2" >打排球
     <input type="checkbox" name="Sports" value="sport3" >踢足球
     <input type="checkbox" name="Sports" value="sport4" >其他
    
   form>
  body>
html>

第6关：重置与提交按钮

DOCTYPE html>
<html>
<body>
 <head>
   <meta charset="utf-8"/>
   <title>设置单行文本框title>
  head>
  <body>
   <form action="" method="post">
     姓名：<input type="text" name="yourname" size="15" maxlength="5"/><br/>
     密码：<input type="password" name="password" size="15" value="12345"/><br/>
     国庆期间你最喜欢看的电影？<br/>
     <input name="Film" type="radio" value="Film1"/>夺冠
     <input name="Film" type="radio" value="Film2"/>我和我的祖国
     <input name="Film" type="radio" value="Film3"/>姜子牙<br/>
    你喜欢的运动是？<br/>
    <input name="Sports" type="checkbox" value="sport1" checked="checked"/>打篮球
     <input name="Sports" type="checkbox" value="sport2"/>打排球
     <input name="Sports" type="checkbox" value="sport3"/>踢足球
     <input name="Sports" type="checkbox" value="sport4"/>其他 <br/> 
    
     <input type="reset" value="重置"/>
<input type="submit" value="提交"/>
     
    
   form>
  body>
html>

创建下拉列表

第1关：下拉列表控件相关概念

1、标签用于创建（ ）
下拉列表选框

2、用于在表单中插入一个下拉列表框，它需要与哪个标签配合使用（ ）

3、设置下拉列表框中某项被默认选中的属性是( )。
selected

4、若设置下拉列表为多选，可在select标签中添加（ ）属性。
multiple

5、下拉列表设置 表明（ ）
可以看到3个下拉列表选项

第2关：创建下拉列表

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建下拉列表title>
 head>
 <body>
  <form action="" method="get">
   
  <select size="2">
   <option value="SH">玩游戏option>
   <option value="BJ">看电影option>
   <option value="HB">听音乐option>
   select>
   
  form>
 body>
html>

第3关：设置多选和默认选项

DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8"/>
  <title>创建多选和默认选项title>
 head>
 <body>
  <form action="" method="get">
   
 <select multiple="multiple">
  <option value ="peach" selected>猫option>
  <option value ="banana" >狗option>
  <option value="apple">鸟option>
  <option value="orange">鸭子option>
  select>
   
  form>
 body>
html>

对表单元素分组

第1关：分组元素相关的概念

1、fieldset标签用于定义（ )
表单的一个子容器

2、表单的分组标题可以用（ ）设置。
legend标签

3、下列选项中，（ ）不属于fieldset标签的属性。
size

4、下列关于表单分组的设置代码，正确的是（ B ）


请选择个人爱好
打篮球
打排球

第2关：对表单元素分组

DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>表单分组title>
 head>
<body>
    <form>
        
      <fieldset>
   <legend>请选择个人爱好legend>
   <input type="checkbox"  name="hobby">音乐      
   <input type="checkbox" name="hobby">体育
   <input type="checkbox" name="hobby">其他
 fieldset>     
        
    form>
body>
html>

给表单组件添加说明

第1关：label标签相关概念

1、

为了给单行文本框绑定文本标注，以便于用户单击该关联文本时可以使文本框获得焦点，可采用（ B ）标签定义文本。
label

2、标签中的for属性取值为（ C ）
要绑定的表单控件的id属性值

3、标签中的form属性取值为（ A ）
所属表单的id值

第2关：给表单组件添加说明__单选框

DOCTYPE html>
 <head>
  <meta charset="UTF-8">
  <title>为表单的单选控件添加说明title>
 head>
 <body>  
  <form>
   国庆期间你最喜欢看的电影？<br/>
   
   <input type="radio" name="Film" value="Film1">夺冠
   <input type="radio" name="Film" value="Film2" id="Film2"><label for="Film2">我和我的祖国label> 
   <label ><input type="radio" name="Film" value="Film3">姜子牙label>    
   
  form>
 body>
html>

第3关：给表单组件添加说明——多选框

DOCTYPE html>
 <head>
  <meta charset="UTF-8">
  <title>为表单的复选控件添加说明title>
 head>
 <body>  
  <form>
   你喜欢的运动是？<br/>
   
    <input type="checkbox" name="Sports" value="sport1" checked id="Sport1">打篮球
    <input type="checkbox" name="Sports" value="sport2" id="sport2"><label for="sport2">打排球label>
    <label><input type="checkbox" name="Sports" value="sport3"id="sport3">踢足球label>
    <input type="checkbox" name="Sports" value="sport4">其他
   
  form>
 body>
html>

第4关：给表单组件添加说明-文本框和文本域

DOCTYPE html>
 <head>
  <meta charset="UTF-8">
  <title>为文本域控件添加说明title>
 head>
 <body>  
  <form>
   推荐人：
   
    <input type="text" autofocus="autofocus"><br>
    <label for="reason">推荐理由：label>
    <textarea id="reason" required rows="6" cols="60" wrap="hard">textarea>
   
  form>
 body>
html>

对表单进行验证

第1关：表单验证相关的概念

1、下列选项中，对表单控件的值进行非空验证的属性为（ A ）
required

2、在input控件的类型中，下列选项中对输入有校验功能的是（ C ）
email

3、关于输入字符数的限定，下列代码中，设置正确的是（ D ）。

4、匹配1个或多个在它前面的元字符是（ B ）。
+

5、若限定用户输入6位数字，下列的代码正确的是（ C ）。

第2关：非空校验

 <html>
  <head>
   <meta charset="utf-8"/>
   <title>设置非空校验title>
  head>
  <body>
   <form>
      密码：
   
      <input type="password" required="required" maxlength="6" title="请输入不超过6位的密码！">
   
       <input type="submit"  value="提交"/> 
    form>
  body>
 html>

第3关：邮箱校验

 <html>
  <head>
   <meta charset="utf-8"/>
   <title>设置邮箱校验title>
  head>
  <body>
   <form>
      密码：
     <input type="password"  required="required" title="请输入6位密码！" maxLength="6"/><br/>
     邮箱：
   
     <input type="email" required="required" placeholder="输入格式：xxx@xxx">
   
     <br/> <input type="submit"  value="提交"/> 
    form>
  body>
 html>

第4关：pattern验证

<html>
  <head>
   <meta charset="utf-8"/>
   <title>设置年龄校验title>
  head>
  <body>
   <form>
      密码：
     <input type="password"  required="required" title="请输入6位密码！" maxLength="6"/><br/>
     邮箱：
      <input type="email"  required="required" placeholder="输入格式：xxx@xxx"/><br/>
     年龄：
   
     <input type="text" required="required" pattern="^[1-9]?[0-9]$">
   
     <br/> <input type="submit"  value="提交"/> 
    form>
  body>
 html>

创建文本区域

第1关：textarea控件相关概念

1、若将文本区域设置为显示10行，每行显示50个字符，正确选项是（ C ）

2、若将文本区域设置为只读的，可在textarea标签中添加（ B ）属性。
readonly

3、在表单提交时使textarea 中的文本换行，正确的选项是（ D ）