Html input 标签

Html input 标签

<html>
<body>
    <!-- type="text" 普通文本输入框 -->
    <input type="text" />

    <!-- type="password" 密码输入框 -->
    <input type="password" />
    
    <!-- type="email" 邮件输入框 -->
    <input type="email" />
    
    <!-- type="number" 数字选择输入框 -->
    <input type="number" />
    
    <!-- type="color" 颜色选择输入框 -->
    <input type="color" />
    
    <!-- type="time" 时间选择输入框 -->
    <input type="time" />
    
    <!--  type="tel" 移动端输入框，自动弹出键盘界面 -->
    <input type="tel" />
    
    <!-- type="button" 按钮框默认无功能、value="登录"按钮框内值 -->
    <input type="button" value="登录"/>
    
    <!-- type="submit" 提交按钮框可返回输入框数据、value="登录"按钮框内值 -->
    <input type="submit" value="登录"/>
    
    <!-- type="radio" 单选框、name="xxx"指定key值 相同key值会互斥不能多选、value="1"返回提交的value判断值得不同 -->
    <input type="radio" name="xxx" value="1" />
    <input type="radio" name="xxx" value="2"/>
    
    <!-- type="checkbox" 复选框、name="xxx"指定key值相同key值分类、value="1"返回提交的value判断值得不同、checked="checked"默认勾选-->
    <input type="checkbox" name="xxx" value="1"/>
    <input type="checkbox" name="xxx" value="2"/>
    <input type="checkbox" name="xxx" value="3" checked="checked"/>
    
    <!-- type="reset" 清空表单内的内容、value="重置"输入框内容-->
    <input type="reset" value="重置">

</body>
</html>

使用属性

<!--name=key -->
<!-- value="内部默认输入内容" -->
<input type="text" name="key" value="xxx"/>

效果