[HTML] 表单和输入

丶灬走出姿态 提交于 2020-01-03 07:55:56

1.用户名和密码的表单

Code:

<form>
姓名:
<input type="text" name="FirstName">
<br />
密码:
<input type="password" name="SecondName">
</form>

运行效果如下:

姓名:
密码:

 

说明: 表单是一个包含表单元素的区域, 表单使用表单标签(<form>)定义.

        表单元素是允许用户在表单中(比如:文本域,下拉列表,单选框,复选框等等)输入信息元素

2. 单选按钮(Radio Buttons)

Code:

<form>

姓别:

<input type=”radio” name=”sex” value=”男">男

<input type=”radio” name=”sex” value=”女">女

</form>

运行效果如下:

姓别:

 

说明: 只能从中选取其一

 

3. 复选框

Code:

<form>

<input type=”checkbox” name=”bike” />I have a bike

<br />

<input type=”checkbox” name=”bike” />I have a car

</form>

运行效果如下:

I have a bike
I have a car

 

4. 按钮

Code:

<form>

<input type=”button” value=”Enter”  />

</form>

运行结果如下:

 

5. 下拉列表框

Code:

<form>

<select name=”fruit”>

<option value=”Apple”>Apple</option>

<option value=”Orange”>Orange</option>

<option value=”Banana” selected=”selected”>Banana</option>

</select>

</form>

运行效果如下:

说明: selected是将该选择项设置为默认选项, 如果不加这个标签, 第一项将是默认选项

6.标题框

Code:

<fieldset>

<legend>登录</legend>

<form>

姓名:

<input type=”text”  name=”name”  />

密码:

<input type=”password” name=”password” />

<input type=”submit” name=”submit” value=”确定">

<input>

</form>

</fieldset>

运行结果如下:

登录
姓名: 密码:

 

参考: http://www.w3school.com.cn/index.html

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!