html标签——表单标签

最新推荐文章于 2022-08-08 09:16:56 发布

Jason_LH1024

最新推荐文章于 2022-08-08 09:16:56 发布

阅读量275

点赞数

分类专栏： JavaEE

本文链接：https://blog.csdn.net/Jason_LH1024/article/details/101017412

版权

JavaEE 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

表单项标签：

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

表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。

input：可以通过type属性值，改变元素展示的样式

type属性：

text：文本输入框，默认值

placeholder：指定输入框的提示信息，当输入框的内容发生变化，

会自动清空提示信息

password：密码输入框

radio：单选框

注意：

1.要想让多个单选框实现单选效果，则多个单选框的name属性值必须一样。

2.一般会给每个单选框提供value属性，指定其被选中后提交的值

3.checked属性，可以指定默认值

checked：复选框

注意：

1.一般会给每一个单选框提供value属性，指定其被选中后提交的值

2.checked属性，可以指定默认值

label：指定输入项的文字描述信息

注意：

label的for属性一般会和input的id属性值对应。

如果对应了，则点击label区域，会让input输入框获取焦点。

file：文本选择框

hidden：隐藏域，用于提交一些信息。

按钮：

submit：提交按钮。可以提交表单

button：普通按钮

image：图片提交按钮

sre属性指定图片的路径

select：下拉列表

子元素：option，指定列表项

textarea：文本域

cols：指定列表，每一行有多少个字符

rows：默认多少行

代码练习：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签_表单项</title>
</head>
<body>

<form action="#" method="get">
  <label> 用户名 </label>：<input type="text" name="username" placeholder="请输入用户名"><br>
   <label> 密码 </label>：<input type="password" name="password" placeholder="请输入密码" ><br>
   性别：<input type="radio" name="gender" value="male" > 男
        <input type="radio" name="gender" value="female" checked> 女
        <br>

    爱好：<input type="checkbox" name="hobby" value="shopping"> 购物
        <input type="checkbox" name="hobby" value="java" checked> Java
        <input type="checkbox" name="hobby" value="game"> 游戏
    <br>
    图片：<input type="file" name="file"><br>
    隐藏域：<input type="hidden" name="id" value="hhh"><br>

    取色器：<input type="color"><br>
    生日：<input type="date" name="birthday"><br>
    生日：<input type="datetime-local" name="birthday"><br>
    邮箱：<input type="email" name="email"><br>
    年龄：<input type="number" name="age"><br>

    省份：<select name="province">
              <option value="">--请选择--</option>
              <option value="1">北京</option>
              <option value="2">上海</option>
              <option value="3" selected>陕西</option>
        </select><br>

    自我描述：<textarea cols="20" rows="5"></textarea><br>

    <input type="submit" value="登录"><br>
    <input type="button" value="一个按钮"><br>
    <input type="image" src="微图.jpg"><br>

</form>


</body>
</html>

浏览器显示：

Jason_LH1024

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
html标签——表单标签

表单项标签：<form> 标签用于为用户输入创建 HTML 表单。表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。 input：可以通过type属性值，改变元素展示的样式 type属性： text：文本输入框，默认值 ...
复制链接

扫一扫

专栏目录