HTML中input可以创建的输入类型有哪几种

2025-10-24 00:09:51

1、首先,我们要清楚input可以创建哪些输入类型呢?

2、第一种,姓名类文本的创建。这种类型比较好记住,只要记住输入的类型是text文本类型就能写对!完整的演示代码可以参考下图。

<form>

名: <input type="text" name="firstname"> <br />

姓: <input type="text" name="lastname">

</form>

HTML中input可以创建的输入类型有哪几种

3、第二种,密码类文本的创建。这种也很好记住,就是password的使用。不过需要注意的是密码在输入的时候,浏览器将使用项目符号来代替这些字符。这也就是我们平时看到的黑点。完整的代码可以参考下图的。

<form>

用户: <input type="text" name="user"> <br />

密码: <input type="password" name="password">

</form> 

HTML中input可以创建的输入类型有哪几种

4、第三种,复选框的创建。这种是checkbox的使用。我们在选择的时候各个选项不会相互的干预,即选择了第一项,同时还可以选择其他几项。我们拿自行车和汽车举例。大家可以试试这个效果。

<form>

我喜欢自行车:<input type="checkbox" name="Bike"> <br />

我喜欢汽车:

<input type="checkbox" name="Car">

</form> 

5、第四种,单选框的创建。这个适用于只有唯一性的选项。单选大家应该明白当用户点击一个单选按钮时,该按钮会变为选中状态,其他所有按钮会变为非选中状态。性别选择就是比较好记的例子。单选的单词是radio要记住哦!

HTML中input可以创建的输入类型有哪几种

6、第五种,按钮的创建。按钮也是输入的一种类型哦!button就是按钮的意思!

<input type="button" value="Hello world!">

我们可以对value里面的值根据自己的需要来定义。

HTML中input可以创建的输入类型有哪几种

7、第六种,以上几种方式的组合应用。组合代码里面新增了<form name="input" action="/html/html_form_action.asp" method="get"> 这条,我相信大家应该能明白吧!

HTML中input可以创建的输入类型有哪几种

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢