Educoder_Web_创建输入控件

目录

第一关 input控件相关概念

第二关 创建文本框

第三关 创建密码框

第四关 创建单选按钮

第五关 创建复选按钮

第六关 重置与提交按钮


第一关 input控件相关概念

 

第二关 创建文本框

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

第三关 创建密码框

<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>

第四关 创建单选按钮

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

第五关 创建复选按钮

<!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>

第六关 重置与提交按钮

<!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>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值