html 中的表单

最新推荐文章于 2024-09-22 00:23:07 发布

欣欣向荣q77

最新推荐文章于 2024-09-22 00:23:07 发布

阅读量170

点赞数

文章标签： html

本文链接：https://blog.csdn.net/qq_52648305/article/details/124134250

版权

本文详细介绍了HTML表单的使用，包括不同类型的输入字段如文本、密码、复选框、单选按钮、下拉框、文本域，以及提交、重置按钮等。还提到了颜色选择、日期选择、文件上传、图像和数字输入等高级特性，并展示了如何设置表单属性如action和method。

摘要由CSDN通过智能技术生成

<!-- 表单:用于收集用户的信息  并提交到服务器 -->

<!-- action  提交的地址  method   请求方式   常用的有get和post -->

<form action="1.html" method="get">

用户名: <input type="text" name="usename"><br>

密&emsp;码: <input type="password" name="password"><br>

<hr>

<!-- name 属性两个作用  :1提交数据    2.实现分组作用(单选框和多选框)

checked  默认选中

-->

性别: 男<input type="radio" name="nan" checked > 女<input type="radio" name="nan"><br>

爱好: 抽烟<input type="checkbox" name="fuxuan" checked> 喝酒<input type="checkbox" name="fuxuan" > 烫头<input type="checkbox" name="fuxuan"><br>

<!-- 下拉框 -->

<select name="adress" id="">

<option value="郑州">郑州</option>

<option value="漯河">漯河</option>

<option value="许昌">许昌</option>

<option value="平顶山">平顶山</option>

</select>

<br>

<br>

<!-- 文本域  默认是cols  30列  rows  10行 -->

<textarea name="" id="" cols="30" rows="10"></textarea>

<br>

<!-- 提交按钮 -->

<input type="submit" value="提交" style="width: 200px;">

</form>

<hr>

<form action="1.html" method="get">

  <input type="text" name="usename" placeholder="请输入用户名">

  <!-- 颜色选择 -->

  <input type="color" >

  <!-- 日期 -->

  <input type="date" name="" id="">

  <!-- 选择文件 -->

  <input type="file" name="" id="">

  <!-- 图片 -->

  <input type="image" src="[https://img1.baidu.com/it/u=1511573730,3968996413&fm=253&fmt=auto&app=138&f=JPEG?w=365&h=500](https://img1.baidu.com/it/u=1511573730,3968996413&fm=253&fmt=auto&app=138&f=JPEG?w=365&h=500)" alt="">

  <!-- 数字大小增减 -->

  <input type="number">

  <!-- 重置 -->

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

  <input type="search" name="" id="">

  <!-- 专门的按钮 -->

  <button disabled="disabled">禁用</button>

  <button type="submit">button提交</button>