HTML基础-input的基本使用

妙先生-

于 2022-10-17 15:03:29 发布

阅读量242

点赞数 2

分类专栏： Chrome input HTML入门文章标签： html servlet 前端 html5

本文链接：https://blog.csdn.net/weixin_53708976/article/details/127363646

版权

Chrome 同时被 3 个专栏收录

1 篇文章 0 订阅

订阅专栏

input

1 篇文章 0 订阅

订阅专栏

HTML入门

1 篇文章 0 订阅

订阅专栏

input系标签的基本介绍：

input标签可以通过不同的type属性值，展示不同效果；

效果展示：

代码：

<!DOCTYPE html>

<html lang="zh">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>input的基本使用</title>

</head>

<body>

    <!-- input的基本使用 -->

   

    <!-- input标签可以通过type属性值的不同，展示不同效果 -->

   

    <!-- type为属性，属性值有很多 -->

   

    <!-- text为文本框，用于输入文本 -->

    文本框：<input type="text">

    <br>

    <!-- password为密码框，输入的文本会被加密显示 -->

    密码框：<input type="password">

    <br>

    <!-- radio：单选框 -->

    单选框：<input type="radio">

    <br>

    <!-- checkbox：多选框 -->

    多选框：<input type="checkbox">

    <br>

    <!-- file：文件选择，用于上传文件 -->

    上传文件：<input type="file">

    <br>

    <!-- submit：提交按钮，用于提交 -->

    提交按钮：<input type="submit">

    <br>

    <!-- reset：重置按钮，用于重置 -->

    重置按钮：<input type="reset">

    <br>

    <!-- button：普通按钮，默认无功能，后续结合js进行使用 -->

    普通按钮：<input type="button">

    <br>

</body>

</html>