当前位置：网站首页 > 技术文章 > 正文

HTML表单search、tel和color高级元素的使用

qihemm 2025-06-25 18:24 7 浏览 0 评论

search类型元素

search类型的input元素是一种专门用来输入搜索关键词的文本框。其代码格式如下。

<input type="search" name="user_search1"/>

（1）编辑代码

打开记事本，编写代码，在<body>标签中加入以下代码。并保存为HTML格式文件。

（2)在浏览器中浏览效果

在浏览器中浏览效果如图所示。

tel类型元素

tel类型的input元素被设计为用来输入电话号码的专用文本框。它没有特殊的校验规则，不强制输入数字(因为许多电话号码通常带有其他文字)，如0577—99886789。但是开发者可以通过pattern属性来制定对于输入的电话号码格式的验证。其代码格式如下。

<input type="tel" name="tel1">

（1）编辑代码

打开记事本，编写代码，在<body>标签中加入以下代码。并保存为HTML格式文件。

（2)在浏览器中浏览效果

在浏览器中浏览效果如图所示，在文本框中输入不满足pattern属性强制规则的号码格式，单击【提交】按钮后会弹出错误提示。

color类型元素

color类型的input元素用来选取颜色，提供了一个颜色选取器。目前它只在部分浏览器中被支持。其代码格式如下。

<input type="color" name="tel1"/>

（1）编辑代码

打开记事本，编写代码，在<body>标签中加入以下代码。并保存为HTML格式文件。

（2)在浏览器中浏览效果

在浏览器中浏览效果如图所示，单击下拉箭头，弹出颜色选择框。

html表单属性有哪些

上一篇：HTML常用标签概述(可用于网店装修)
下一篇：HTML DOM Reset 对象

相关推荐

VLOOKUP的18种高阶用法大公开!99%的人都不知道的神操作!: 作为被头条用户催更的Excel课代表，今天带来让HR追着要模板、让老板主动加薪的VLOOKUP终极指南！从基础到高阶一网打尽，文末送36个行业专用模板！一、为什么你的VLOOKUP总报错？血泪大数据...

Vlooup公式，2种模糊查找匹配，1分钟学会: 工作中，VLOOKUP公式使用频率是很高的，用来各种查找匹配问题今天我们分享两种模糊查找匹配问题，一种是文本的模糊查找匹配，一种是数字的模糊查找匹配问题1、文本模糊查找匹配使用模拟数据举个例子，原始数...

与vlookup功能相似的函数，照样搞定表格数据查询，简单还实用: 在日常表格数据处理工作，说到数据查询，很多小伙伴首先想到的是Vlookup函数，老师的教程中也多次讲到Vlookup函数的用法和实例。其实在Excel中还有其他的数据查询函数公式或技巧，今天我们先来学...

别再折腾VLOOKUP了!DGET逆向查找10秒通关，小白必看: 今天要掀翻一个“过气网红”——VLOOKUP！你是不是也经历过这些崩溃瞬间：逆向查找要交换列顺序，复制粘贴到手软！多条件查找要嵌套MATCH，公式长到怀疑人生！别忍了！今天教你用DGET函数一键封...

职场新人必学!VLOOKUP函数10分钟速成指南: 正文："今天来讲解办公人入职期初函数VLOOKUP，这是所有职场人最重要也是最基础的技能。掌握它，90%的数据查找再不用求人！特别献给刚入职场的你——别让Excel成为加班理由。"——...

巧用Vlookup函数揪出“第三者”（vlookup第三个参数是什么）: 在一张Excel表格的重复记录中，让你快速列出每种不同物品第2次或第n次出现的记录，你会怎么做？Vlookup函数就有这个本事。举例来说，产品或者物流表格中往往会记录有同一货物的多笔数据（如下图的今日...

分享12个VLOOKUP超经典用法（vlookup通俗易懂）: 刚毕业那会，面试的时候经常会被问到会不会用Excel？我就理直气壮地回答：“会啊。”毕竟，简历上可是写着熟练。接着面试官扔出一句“那你会VLOOKUP吗？”我还是会一口咬定：“我会。“其实，我都没用过...

查找匹配别只知道Vlookup，Sumifs也可以!: 工作中遇到查找匹配问题的时候，大家第一反应是不是都想到的Vlookup公式呢，有没有小伙伴们给Sumifs一点点机会的呢，有时候Sumifs比Vlookup更好用1、Vlookup公式举个例子，左边是...

Excel函数讲解:VLOOKUP函数，轻松玩转数据查找: 常用函数系列教学：VLOOKUP函数讲解(46)。不懂VLOOKUP函数怎么高效查找数据？闲话少叙直接开讲。基本含义：VLOOKUP函数用于在表格按垂直方向(到)上查找返回行数据。如何使用及注意事项？...

CHOOSEROWS+CHOOSECOLS原来是一个超级查找函数组合!: 场景一：要在学生名册中，抽查一名学生成绩。公式：=CHOOSEROWS(A1:D5,2)解析：第一参数A1:D5为数据区域，第二参数2表示提取第2行数据。把数据区域改为A2:D5,结合RANDBETW...

数据查询不止有vlookup函数，自定义zlookup函数查询操作更高效: Excel数据查询，相信大家首先会想到vlookup函数。毋庸置疑vlookup函数在Excel数据查询中作用是非常的强大。但是它也有一些不能实现的数据查询。如上图所示，我们需要根据人员的出现次数，提...

「EXCEL进阶」VLOOKUP函数怎么查询一个值返回多个结果: 前言：VLOOKUP函数一般一次只能返回一个结果，本例介绍通过辅助列的方法使VLOOKUP函数查询一个值，返回这个值对应的多个结果。使用场景举例：根据表格中同一数值，返回对应值的多个结果。比如这张数据...

WPS查找能手VLOOKUP函数使用方法讲解: 各位同学好！今天我们来深度剖析WPS最实用的查找工具——VLOOKUP函数。这个函数能帮你在表格中快速定位并提取所需数据，可以帮你快速核对两批数据差异，还可以合并多个表格的关联信息，甚至可以帮你制作动...

Excel常用10个函数:跨表查找Vlookup，适用于大数据中查找精确值: Hello大家好，我是Office米，今天，我们将和大家一起分享交流，常用的10个函数之一：查找引用函数VLOOKUP。在说VLOOKUP函数之前，我们要先了解，平时Excel日常工作中会遇到哪些问题...

掌握了这个套路，无论用 Excel vlookup 函数查找第几次结果都很轻松: 用vlookup查找默认情况下是一对一出结果，如果要一对多查找，就需要用到各种技巧，具体方法我写过非常多了，可以搜索一下历史记录。只要掌握了今天这个套路，无论你想查找第几次重复值，都易如反掌。案例...

取消回复欢迎你发表评论:

一周热门

最近发表

首页
收录
顶部