html学习——搜索框、简单验证、滑块

最新推荐文章于 2023-10-26 17:26:01 发布

原创最新推荐文章于 2023-10-26 17:26:01 发布 · 294 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html

新手学习同时被 2 个专栏收录

20 篇文章

订阅专栏

html学习

17 篇文章

订阅专栏

本文详细介绍了HTML表单中常用的验证元素，包括邮箱输入、URL验证、数字输入框的设置（如最大值、最小值和步长），以及滑块组件的应用，帮助开发者理解并实现网页表单的有效交互设计。

简单验证、滑块、搜索框

上为显示效果下为代码

<form method="get" action="result.html">
<!--邮箱验证-->
	<p>邮箱：
	<input type="email" name="email">
	</p>
<!--网址验证-->
	<p>url：
	<input type="url" name="url">
	</p>
<!--数字验证
	max:数字框内最大数
	min:数字框内最小数
	step:步长，一次增减的量
-->
	<p>数字：
	<input type="num" name="num" max="100" min="0" step="10">
	</p>
<!--滑块
	最常见的是音量条，step用来控制一次滑动调节的量-->
	<p>音量：
	<input type="range" name="voice" max="100" min="0" step="2">
	</p>
<!--搜索-->
	<p>搜索：
	<input type="search" name="search"></p>
</form>