html中input高级技巧

最新推荐文章于 2024-05-14 09:05:14 发布

asnone0

最新推荐文章于 2024-05-14 09:05:14 发布

阅读量114

点赞数

分类专栏：代码文章标签： html 前端

本文链接：https://blog.csdn.net/qq_53912756/article/details/128064394

版权

代码专栏收录该内容

6 篇文章 0 订阅

订阅专栏

可以使用input中的type属性来直接实现验证输入格式

代码如下

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
</head>
<style type="text/css">
</style>
<body>
    <!-- 我们验证的时候必须添加form表单域 -->
    <form action="">
    	<ul>
    		<li>邮箱：<input type="email"></li>
    		<li>网址：<input type="url"></li>
    		<li>日期：<input type="date"></li>
    		<li>时间：<input type="time"></li>
    		<li>数量：<input type="number"></li>
    		<li>手机号码：<input type="tel"></li>
    		<li>搜索：<input type="search"></li>
    		<li>颜色：<input type="color"></li>
    		<!-- 当我们点击提交按钮就可以验证表单了 -->
    		<li><input type="submit" value="提交"></li>
    	</ul>
    </form>
</body>
</html>