创建输入控件

最新推荐文章于 2023-03-10 12:03:36 发布

静待花开︳

最新推荐文章于 2023-03-10 12:03:36 发布

阅读量495

点赞数

分类专栏： educoder Web前端文章标签： html

本文链接：https://blog.csdn.net/weixin_52184490/article/details/121744522

版权

educoder 同时被 2 个专栏收录

51 篇文章 9 订阅

订阅专栏

Web前端

35 篇文章 2 订阅

订阅专栏

第1关：input控件相关概念

1、在表单中插入单选按钮的HTML代码是（）。 D.<imput type="radio">

2、HTML代码<input type="text" name="foo" size="20">表示（　）B.创建一个单行文本输入区域

3、对于标签<input type=*>，如果希望实现密码框效果，* 值是（）。C.password

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

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

第2关：创建文本框

编程要求

请在右侧编辑器中的Begin - End区域内补充代码，具体要求是： 1.创建一个单行文本框 2.文本框的名称为“yourname" 3.文本框的宽度为15 4.文本框中最多输入字符数为5

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

第3关：创建密码框

编程要求

请在右侧编辑器中的Begin - End区域内补充代码，具体要求是： 1.创建一个密码框 2.密码框的名称为“yourpassword" 3.文本框的宽度为15 4.密码初值为“12345”

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

第4关：创建单选按钮

编程要求

请在右侧编辑器中的Begin - End区域内补充代码，具体要求是： 1.创建一个三选一的选择区 2.单选的名称为“Film" 3.第一个选项的value值为“Film1”，提示文字为"夺冠" 4.第二个选项的value值为“Film2”，提示文字为"我和我的祖国" 5.第三个选项的value值为“Film3”，提示文字为"姜子牙"

<!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/>
    <!-- ********* Begin ********* -->
     <!--Film<br>-->
    <input name="Film"type="radio"value="Film1">夺冠
    <input name="Film"type="radio"value="Film2">我和我的祖国
    <input name="Film"type="radio"value="Film3">姜子牙
    <!-- ********* End ********* -->
   </form>
  </body>
</html>

第5关：创建复选框

编程要求

请在右侧编辑器中的Begin - End区域内补充代码，具体要求是： 1.创建一个多项选择区 2.多选的名称为“Sports" 3.第一个选项的value值为“sport1”，提示文字为"打篮球"，该选项设为默认选项 4.第二个选项的value值为“sport2”，提示文字为"打排球" 5.第三个选项的value值为“sport3”，提示文字为"踢足球" 6.第四个选项的value值为“sport4”，提示文字为"其他"

<!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/>
    <!-- ********* Begin ********* -->
     <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">其他
     
    <!-- ********* End ********* -->
   </form>
  </body>
</html>

第6关：重置与提交按钮

编程要求

请在右侧编辑器中的Begin - End区域内补充代码，具体要求是： 1.创建一个重置按钮，按钮上显示文字“重置” 2.创建一个提交按钮，按钮上显示文字“提交”

<!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/> 
    <!--********* Begin ********* -->
     <input type="reset"value="重置">
     <input type="submit"value="提交">
    <!-- ********* End ********* -->
   </form>
  </body>
</html>

静待花开︳

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
创建输入控件

第1关：input控件相关概念1、在表单中插入单选按钮的HTML代码是（）。 D.<imput type="radio">2、HTML代码<input type="text" name="foo" size="20">表示（　）B.创建一个单行文本输入区域3、对于标签<input type=*>，如果希望实现密码框效果，* 值是（）。C.password4、下列选项中，用于设置input控件在首次加载时为禁用的属性是（）。A.disa...
复制链接

扫一扫