HTML表单和PHP环境的搭建—表单的创建

最新推荐文章于 2022-01-29 15:11:33 发布

煮着不如烤着吃

最新推荐文章于 2022-01-29 15:11:33 发布

阅读量678

点赞数 1

CC 4.0 BY-SA版权

分类专栏： WEB_HTML 总结

本文链接：https://blog.youkuaiyun.com/qq_40171918/article/details/80611318

WEB_HTML 总结专栏收录该内容

9 篇文章

订阅专栏

本文详细介绍了HTML表单中的各种元素及其用法，包括输入字段、下拉列表、文本区域等，并提供了实例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
<form>
    账户：
    <input type="text">
    <br/>
    密码：
    <input type="text">
    <br/>
    你喜欢的水果有哪些？
    <br/>
    苹果<input type="checkbox">
    西红柿<input type="checkbox">
    香蕉<input type="checkbox">
    <br/>
    请选择你的性别：
    男<input type="radio" name="sex">
    女<input type="radio" name="sex">
    <br/>
    选择你最常用的网站名称：
    <select>
        <option >www.baidu.com</option>
        <option >www.google.com</option>
        <option >www.aini.com</option>
    </select>
    <input type="button" value="按钮">
    <input type="button" value="提交">
</form>
    <textarea cols="30" rows="30">请在此填写信息：</textarea>
</body>
</html>

以上有一些简单的表单搭建。下面我们讲解一下以上出现的标签及其属性：

1. <form> 标签

定义和用法

<form> 标签标签用于创建供用户输入的 HTML 表单。

form 元素包含一个或多个表单元素，比如：

button 按钮
input 输入
keygen 注册
object 项目
output 输出
select 选择
textarea 文本域

2.<input> 标签

定义和用法

<input> 标签用于搜集用户信息。

根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

比如：

1.text ：文本字段

2.checkbox：复选框（能够进行多选）

3.password：掩码后的文本控件（密码）

4.radio：单选按钮对于单选按钮必须归为一类才能实现单选如上面的男和女归为性别一类

5.button ：按钮，可以用于提交按钮或者是确定按钮

3.<select> 标签

定义和用法

select 元素可创建单选或多选菜单。

<select&> 元素中的 <option> 标签用于定义列表中的可用选项。

提示和注释：

提示：select 元素是一种表单控件，可用于在表单中接受用户输入。

上面的代码是演示如何在HTML页面中创建简单的下拉列表框。下拉列表框是一个可选列表。
另外还可以写成

<select name="webs">
        <option value="www.baidu.com">www.baidu.com</option>
        <option value="www.google.com" selected="selected">www.google.com</option>
        <option value="www.aini.com">www.aini.com</option>
        <option value="www.hello.com">www.hello.com</option>
    </select>

这就成了有预选值得下拉列表框

4.<textarea> 标签