HTML search 标签

HTML search 语法

在 HTML 中，search 标签是一个语义化的块级容器，专门用于包含与搜索相关的表单元素，比如搜索输入框、按钮等。

search 标签的作用和 div 类似，它们都是容器元素。但 search 更具语义化，它明确表达了 “这里是一个搜索区域”，对浏览器、搜索引擎和辅助技术（如屏幕阅读器）更加友好。

语法：

<search>
    <!--与搜索相关的表单元素-->
</search>

说明：

你可以在 search 中放入 form、input、button 等表单标签。

HTML search 摘要

属于	HTML 表单
使用频率	中
兼容性	查看
官方文档	查看
MDN	查看

HTML search 示例

接下来，我们通过一个简单的例子来讲解一下 HTML search 标签是如何使用的。

示例：search 标签的基本用法

运行代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    <header>
        <h1>绿叶网</h1>
        <search>
            <form method="get" action="/">
                <input type="search" name="keyword">
                <button type="submit">搜索</button>
            </form>
        </search>
    </header>
</body>
</html>

页面效果如下图所示。