HTML5旅游网表单,HTML5—表单

文章目录

表单是一个包含表单元素的区域，表单元素是允许用户在表单中输入内容，比如：文本域、下拉列表、单选框、复选框等等。

表单使用表单标签

来设置，多数情况下被用到的表单标签是输入标签()，输入类型是由类型属性(type)定义的

1. 单行文本输入框

实例：

提示：

默认：

效果如下：

注意：表单本身并不可见

2. 多行文本输入框

实例：

效果：

3. 密码输入框

实例：

Password:

效果：

注意：密码字段字符不会明文显示，而是以星号或圆点替代

4. 按钮

按钮有好几种实现方法，如下：

按钮2

效果：

注意：按钮1只是一个普通的按钮，按钮2和提交按钮会刷新页面，重置按钮会重置页面，但不会刷新

5. 单选框

实例：

请选择您的爱好?

A. 写代码

B. 看电影

C. 玩游戏

效果：

说明：checked表示默认选中，disabled表示禁用，不能修改

6. 复选框

实例：

请选择您的爱好?

A. 写代码

B. 看电影

C. 玩游戏

效果：

7. 下拉菜单

实例：

写代码

看电影

玩游戏

效果：

说明：selected表示默认选中

8.扩展

8-1. 网址分析

有如下一个网址：

http://127.0.0.1:8848/Study/day02/test.html?like2=code&like2=game

说明：

http://协议

127.0.0.1IP/Host

8848Port端口

/Study/day02/路径

test.html访问文件

?分隔参数和服务器地址

like2=code&like2=game参数

8-2. input输入类型：color

实例：从拾色器中选取颜色

选择你喜欢的颜色:

效果：

点击颜色框，就会弹出颜色选择器

8-3. input输入类型：file

实例：选择文件

效果：

8-4. input输入类型：number

实例：文本框只能输入数字

8-5. input输入类型：date

实例：定义date控件

效果：

8-6. input输入类型：email

定义用于e-mail 地址的字段(当提交表单时会自动对 email 字段的值进行验证)

实例：

E-mail:

效果：

8-7. 颜色的写法

(1) 颜色单词

第一种写法

(2) 十六进制

第二种写法

(3) rgb

第三种写法

说明：

r，g，b范围: 0 ~ 255

(4) rgba

第三种写法

说明：

a: alpha透明度，范围：0~1，0表示全透明，1表示不透明

效果：

标签：表单,实例,HTML5,按钮,类型,input,输入

来源： https://blog.csdn.net/TaoismHuang/article/details/96451571