h5增强表单---input

h5增强表单---input

min="0" max="100":最小值0,最大值100

step:步长

添加一个name值方便提交后端

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="">
        <div>
            颜色选择:
            <input type="color" name="color" id="">
        </div>
        <div>
            邮箱:<input type="email" name="email">
        </div>
        <div>
            url地址:<input type="url" name="url">
        </div>
        <div>
            电话号码(手机端使用):<input type="tel">
        </div>
        <div>
            滑块效果:<input type="range"  name="range" min="100" max="500" value="100">
        </div>
        <div>
            数字类型<input type="number" min="0" max="100" value="4" step="3" name="age">
        </div>
        <div>
            搜索:<input type="search">
        </div>
        <div>
            日期选择<input type="date">
            月份选择<input type="month">
            周数选择<input type="week">
            <input type="datetime-local" name="datename">
        </div>
        <input type="submit">
    </form>
    
</body>
</html>

代码运行效果

相关推荐
吞掉星星的鲸鱼31 分钟前
使用高德api实现天气查询
前端·javascript·css
lilye6634 分钟前
程序化广告行业(55/89):DMP与DSP对接及数据统计原理剖析
java·服务器·前端
....49235 分钟前
Vue3 + Element Plus + AntV X6 实现拖拽树组件
javascript·vue.js·elementui·antvx6
hello_simon2 小时前
在线小白工具,PPT转PDF支持多种热门工具,支持批量转换,操作简单,高效适合各种需求
pdf·html·powerpoint·excel·pdf转html·excel转pdf格式
zhougl9962 小时前
html处理Base文件流
linux·前端·html
花花鱼3 小时前
node-modules-inspector 可视化node_modules
前端·javascript·vue.js
HBR666_3 小时前
marked库(高效将 Markdown 转换为 HTML 的利器)
前端·markdown
careybobo4 小时前
海康摄像头通过Web插件进行预览播放和控制
前端
TDengine (老段)5 小时前
TDengine 中的关联查询
大数据·javascript·网络·物联网·时序数据库·tdengine·iotdb
杉之6 小时前
常见前端GET请求以及对应的Spring后端接收接口写法
java·前端·后端·spring·vue