HTML <main> 標籤
示例
指定文件的主要內容
<main>
<h1>最受歡迎的瀏覽器</h1>
<p>Chrome、Firefox 和 Edge 是當今最常用的瀏覽器。</p>
<article>
<h2>Google Chrome</h2>
<p>Google Chrome 是由 Google 開發的網路瀏覽器,於 2008 年釋出。Chrome 是當今世界上最受歡迎的網路瀏覽器!</p>
</article>
<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox 是由 Mozilla 開發的開源網路瀏覽器。自 2018 年 1 月以來,Firefox 一直是第二受歡迎的網路瀏覽器。</p>
</article>
<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge 是由 Microsoft 開發的網路瀏覽器,於 2015 年釋出。Microsoft Edge 取代了 Internet Explorer。</p>
</article>
</main>
自己動手試一試 »
更多“自己嘗試”的例子見下文。
定義和用法
<main> 標籤定義文件的主要內容。
<main> 元素中的內容應該是文件獨有的。它不應包含跨文件重複的內容,例如側邊欄、導航連結、版權資訊、網站徽標和搜尋表單。
注意:文件中不得包含多個 <main> 元素。<main> 元素不得是 <article>、<aside>、<footer>、<header> 或 <nav> 元素的後代。
瀏覽器支援
表格中的數字表示完全支援該元素的首個瀏覽器版本。
元素 | |||||
---|---|---|---|---|---|
<main> | 26.0 | 12.0 | 21.0 | 7.0 | 16.0 |
全域性屬性
<main> 標籤還支援 HTML 中的全域性屬性。
事件屬性
<main> 標籤還支援 HTML 中的事件屬性。
更多示例
示例
使用 CSS 為 <main> 元素設定樣式
<html>
<head>
<style>
main {
margin: 0;
padding: 5px;
background-color: lightgray;
}
main > h1, p, .browser {
margin: 10px;
padding: 5px;
}
.browser {
background: white;
}
.browser > h2, p {
margin: 4px;
font-size: 90%;
}
</style>
</head>
<body>
<main>
<h1>最受歡迎的瀏覽器</h1>
<p>Chrome、Firefox 和 Edge 是當今最常用的瀏覽器。</p>
<article class="browser">
<h2>Google Chrome</h2>
<p>Google Chrome 是由 Google 開發的網路瀏覽器,於 2008 年釋出。Chrome 是當今世界上最受歡迎的網路瀏覽器!</p>
</article>
<article class="browser">
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox 是由 Mozilla 開發的開源網路瀏覽器。自 2018 年 1 月以來,Firefox 一直是第二受歡迎的網路瀏覽器。</p>
</article>
<article class="browser">
<h2>Microsoft Edge</h2>
<p>Microsoft Edge 是由 Microsoft 開發的網路瀏覽器,於 2015 年釋出。Microsoft Edge 取代了 Internet Explorer。</p>
</article>
</main>
</body>
</html>
自己動手試一試 »