HTML5表单学习

学习地址:http://www.w3school.com.cn/tags/tag_form.asp

文本域(text fields)


<html>

<body>

<form method="post" action="">

姓:<input type="text" name="xing">

名:<input type="text" name="ming">

</form>

</body>

</html>

代码中的type="text"就是文本域的书写形式.

密码域:

<input type="password" name="password">

复选框:

<input  type="checkbox" name="car">

<input type="checkbox" name="bike">

复选框的意思就是一次可以选择多个选项.

单选框:


男性:<input type="radio" checked="checked"  name="sex" value="male">

女性:<input type="radio" name="sex" value="female">

checked="checked"表示默认选中的项.

下拉列表:

<form>

<select name="cars">

<option value="audi">audi</option>

<option value="ford">ford</option>

<option value="volvo">volvo</option>

</select>

</form>

带选中的下拉列表:

<select name="cars">

<option value="audi">audi</option>

<option value="ford" selected="selected">ford</option>

<option value="volvo">volvo</option>

</select>

文本域(textarea)

<textarea name="content" cols="20" rows="10"> 这里是填写内容的地方.</textarea>

创建按钮:

<input tpye="button" value="这是自定义按钮名字">

围绕数据的fieldset:


<form>

<fieldset>

<legend>围绕数据说明</legend>

<input type="text" name="a">

<input type="text" name="b">

</fieldset>

</form>

确认按钮:

<input type="submit" value="确认">

重置按钮:

<input type="reset" value="重置">


电子邮件发送表单:

这个不写代码了感觉用途不大,贴个图吧.


表单的学习感觉太简单了,其实通常用到的蛮多.这个要重点关注学习下.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一.什么是< form>表单 格式: 作用:form表单一般用来收集用户的信息,并把信息传送到后台。 注意点:1....
    饥人谷_刘冲阅读 7,808评论 0 1
  • 表单表单是用来提交资料、意见,规范流程执行过程的格式。在网页中主要负责数据采集功能。表单标签:这里面包含了处理表单...
    思思有礼阅读 4,375评论 0 0
  • 1.form标签简介 网站怎样与用户进行交互?答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送...
    饥人谷_小侯阅读 2,972评论 0 0
  • 表单是Web页面上负责用户输入与服务器端数据交互的最基础方式,这里我们针对最基本的表单内容显示,来看一下HTML的...
    我是一只_鱼阅读 2,350评论 0 0
  • 原文地址:React.js Forms: Controlled Components 原文作者:Loren Ste...
    iKcamp阅读 4,288评论 0 5