表单的总结-HTML入门基础(026)

今天我们对前面分享的内容进行一下总结。

 

表单,是一组标签的统称,即文本框、按钮等的统称。表单标签共有4个,分别是input、textarea、select和option。其中select和option是配合使用的。

 

input标签:

语法:

 

<input type="表单类型">

    

属性值:

text,单行文本框;

password,密码文本框;

button,按钮;

submit,提交按钮;

reset,重置按钮;

image,图片形式的按钮;

radio,单选按钮;

checkbox,复选框;

hidden,隐藏域;

file,文件上传。

 

 

 

textarea标签:

语法:

 

<textarea rows="行" cols="列">内容</textarea>

 

文字不多时,使用单行文本框,文字较多时使用多行文本框,密码等隐藏值使用密码文本框。

 

 

select和option标签:

语法:

 

<select multiple="multiple" size="列表数目">  <option value="值" selected="selected">选项值</option>  <option></option></select>

 

初学者一般会有疑问,HTML表单那么多,每种标签有好几个属性,如何记得住?

 

在学习HTML表单时,不用太刻意的去记忆属性,多练习,能记住最好,记不住,多使用也能有印象保留的。关键还是动手敲代码,才能更深刻。

 

另外,所有表单控件都必须放置在<form></form>标签之间,这样的数据才可以提交至服务器。

 

 

下面我们做个练习题:

 

​​​​​​​

<html>  <head>    <title>个人注册</title>  </head>  <body>    <form name="form1" method="" action="post">           用户名:<input type="text" id="user_name" name="user_name" value="admin"><br>      密码:<input type="password" id="pwd" name="pwd" value="123456"><br>      邮箱:<input type="text" id="email_1" name="email_1" value="admin">      <select id="email_2">        <option value="qq">qq.com</option>        <option value="163">163.com</option>        <option value="sina">sina.com</option>      </select><br>      性别:      <input type="radio" id="boy" name="sex" checked="checked"><label for="boy">男</label>      <input type="radio" id="girl" name="sex"><label for="girl">女</label><br>      兴趣:      <input type="checkbox" id="read" name="read"><lable for="read">读书</label>      <input type="checkbox" id="newspaper" name="newspaper"><label for="newspaper">看报</label>      <input type="checkbox" id="game" name="game" checked="checked"><lable for="game">打电动</label><br>      <p>个人介绍:</p>      <textarea id="personal" name="personal" rows="15" cols="40">我是虾米大王</textarea><br>      <input type="submit" id="submit" name="submit" value="注册"><br>      <p>上传个人照片:</p>      <input type="file" id="file1" name="file1">    </form>  </body></html>

 

下节我们分享一下关于多媒体的内容。

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

虾米大王

有你的支持,我会更有动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值