39-HTML标签表单标签表单项这里html和css种＜br＞是换行

山东大葱

已于 2022-03-08 10:28:05 修改

阅读量585

点赞数

分类专栏： JavaWeb 文章标签： mysql 数据库 sql

于 2021-11-28 15:00:04 首次发布

本文链接：https://blog.csdn.net/shwjakak/article/details/121589600

版权

JavaWeb 专栏收录该内容

89 篇文章 1 订阅

订阅专栏

* 表单项标签：表单项标签有三个 input select下拉列表 textarea文本域
           * input：可以通过type属性值，改变元素展示的样式
               * type属性：type里面有很多种标签样式比如text passwod等等等
                   * text：文本输入框，默认的
                       * placeholder：指定输入框的提示信息，当输入框的内容发生变化，会自动清空提示信息

* password：密码输入框

                   * radio:单选框
                       * 注意：
                           1. 要想让多个单选框实现单选的效果，则多个单选框的name属性值必须一样。如果不一样就不是单选了几个点都可以点而如果name属性值一样则只能单选点一个

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

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

* checkbox：复选框（可以多选比如爱好）

                       * 注意：
                           1. 一般会给每一个单选框提供value属性，指定其被选中后提交的值
                           2. checked属性，可以指定默认值相当于默认值

* file：文件选择框

* hidden：隐藏域，用于提交一些信息。不显示但是会提交value的信息

                   * 按钮：
                       * submit：提交按钮。可以提交表单
                       * button：普通按钮
                       * image：图片提交按钮：按钮有点不好看可以用图片替代按钮
                           * src属性指定图片的路径

           * label：指定输入项的文字描述信息
               * 注意：
      * label的for属性一般会和 input 的 id属性值对应。如果对应了，则点击label区域，会让input输入框获取焦点。
           * select: 下拉列表
               * 子元素：option，指定列表项

           * textarea：文本域（可以写好多字一个大框子）
               * cols：指定列数，每一行有多少个字符
               * rows：默认多少行。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单标签</title>
</head>
<body>
<!--
form:用于定义表单的 form可以来定义一个范围 这个范围代表了采集用户数据的范围
form的属性
  action：指定提交数据的URL url其实就是一个位置  这里#是指当前界面 以后写的是服务器端的资源提交到这个地址去
  method：指定提交方式
        method的分类 一共其中 两种常用
        get:
        post:
表单项中的数据要想被提交，必须指定其name属性
-->
<form action="#" method="get">

    <label for="username">用户名</label>：<input type="text" name="username" placeholder="请输入用户名" id="username"><br>
    密码：<input type="password" name="password" placeholder="请输入密码"><br>
    性别：<input type="radio" name="gender" value="male" checked="checked"> 男
         <input type="radio" name="gender" value="famale"> 女
    <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="aaa"><br>

    取色器: <input type="color" name="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>
    //按钮
    <input type="submit" value="登录" ><br>
    <input type="button" value="一个按钮"><br>
    <input type="image" src="img/regbtn.jpg">
</form>

</body>
</html>

山东大葱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
39-HTML标签表单标签表单项这里html和css种＜br＞是换行

* 表单项标签： * input：可以通过type属性值，改变元素展示的样式 * type属性：type里面有很多种标签样式比如text passwod等等等 * text：文本输入框，默认的 * placeholder：指定输入框的提示信息，当输入框的内容发生变化，会自动清空提示信息 * password：密码...
复制链接

扫一扫