首页 技术 正文
技术 2022年11月6日
0 收藏 665 点赞 544 浏览 1500 个字

  表单标签<form>

  • 表单是一个包含表单元素的区域。
  • 表单元素是允许用户在表单中输入信息的元素。

  

  输入标签<input>

  输入标签的输入类型由其类型属性type决定。常见的输入类型如下:

  • 文本域Text Field
<input type="text" name="inputname" />
  • 单选按钮Radio Button

  注意:只能从中选其中一个。  

<form>
<input type="radio" name="sex" value="male" /> 男
<br />
<input type="radio" name="sex" value="female" /> 女
</form>
  • 复选框Checkbox

  当用户要从若干个选项中选择一个或多个选项时使用。

<form>
<input type="checkbox" name="apple" />Apple
<br />
<input type="checkbox" name="banana" />Banana
<br />
<input type="checkbox" name="orange" />Orange
</form>
  • 按钮Button
<form>
<input type="button" value="Click me">
</form>
  • 密码password和提交按钮submit
<form action="target.html" method="get">
用户:
<input type="text" name="user">
<br />
密码:
<input type="password" name="password">
<br />
<input type="submit" value="提交" />
</form>

  域标签<fieldset>和域标题标签<legend>

  域标签<fieldset>可将表单内的相关元素分组打包,生成一组相关表单的字段。浏览器可以以某种特殊方式显示组内元素,比如特殊的边界、3D效果或甚至可创建一个子表单来处理这些元素。

  域标签<fieldset>没有必须的属性。<legend>标签为域标签定义了标题。

<form>
<fieldset>
<legend>健康信息</legend>
身高:<input type="text" />
<br />
体重:<input type="text" />
</fieldset>
</form>

HTML笔记(五)表单<form>及其相关元素

 

  <label>标签

  <label>标签为input元素定义标记。它不会呈现任何特殊的效果,但是,当你把鼠标放在label元素内点击文本,会触发控件。

  <label>标签的for属性应该与相关元素的id属性一致。

<form>
<label for="male">男</label>
<input type="radio" name="sex" id="male" />
<br />
<label for="female">女</label>
<input type="radio" name="sex" id="female" />
</form>

  

  下拉列表<select>

<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi" selected="true">Audi</option>
</optgroup>
</select>
上一篇: HUD 2203 亲和串
下一篇: iOS - KVC 键值编码
相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,078
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,553
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,402
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,177
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,814
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,898