<main>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
HTML <main> 元素呈现了文档的 <body> 或应用的主体部分。主体部分由与文档直接相关，或者扩展于文档的中心主题、应用的主要功能部分的内容组成。
尝试一下
<header>Gecko facts</header> <main> <p> Geckos are a group of usually small, usually nocturnal lizards. They are found on every continent except Antarctica. </p> <p> Many species of gecko have adhesive toe pads which enable them to climb walls and even windows. </p> </main> header { font: bold 7vw Arial, sans-serif; } - 内容类别Flow content, palpable content.
- 允许内容 Flow content.
- 标签省略无; 开始与结束都是强制性。
- 被允许的父级元素任何支持流内容但可能不是继承元素的 元素
<article>,<aside>,<footer>,<header>, 或<nav> - DOM 接口
HTMLElement
属性
此元素仅包含全局属性。
使用说明
在文档中，<main> 元素的内容应当是独一无二的。任何同时存在于任意一系列文档中的相同、重复内容，比如侧边栏、导航栏链接、版权信息、网站 Logo，搜索框（除非搜索框为文档的主要功能），都不应当被包含在其内。
<main> 对文档的大纲（outline）没有贡献；也就是说，它与诸如 <body> 之类的元素，诸如 <h2> 之类的标题等不同，<main> 不会影响 DOM 的页面结构概念。它仅有提供信息的作用。（原文：It's strictly informative.）
示例
<!-- 其他内容 --> <main> <h1>Apples</h1> <p>The apple is the pomaceous fruit of the apple tree.</p> <article> <h2>Red Delicious</h2> <p> These bright red apples are the most common found in many supermarkets. </p> <p>...</p> <p>...</p> </article> <article> <h2>Granny Smith</h2> <p>These juicy, green apples make a great filling for apple pies.</p> <p>...</p> <p>...</p> </article> </main> <!-- 其他内容 --> 无障碍相关
界标
<main> 元素的行为与 main 界标所定义的角色相一致。 界标可被辅助技术使用，以快速识别并将用户导航到文档中的分段。通常使用 <main> 元素，而不是定义 role="main"，除非是考虑对于旧浏览器的兼容性.
直达内容
直达内容（skipnav），是一种辅助功能技术，使其用户可以快速跳过大段的重复内容（如主导航栏、信息横幅等）。这允许用户更快地访问到页面的主要内容。
向 <main> 元素添加 id 属性后，该元素可成为直达内容链接的目标。
<body> <a href="#main-content">Skip to main content</a> <!-- navigation and header content --> <main id="main-content"> <!-- main page content --> </main> </body>
阅读器模式
规范
| Specification |
|---|
| HTML # the-main-element |
浏览器兼容性
<main> 标签受广泛支持。对于 IE 浏览器 11 版本和低于 11 的版本，推荐向 <main> 元素添加 "main" 这一 ARIA 角色，以保证其无障碍。(屏幕阅读器，如 JAWS，当与较旧版本的 Internet Explorer 一起使用时，需包括此 role 属性才能理解 <main> 元素的语义含义）
<main role="main">...</main>