最新文章專題視頻專題問答1問答10問答100問答1000問答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
當(dāng)前位置： 首頁 - 科技 - 知識(shí)百科 - 正文

HTML5語義化-main

來源：懂視網(wǎng) 責(zé)編：小采 時(shí)間：2020-11-27 15:13:01
文檔

HTML5語義化-main

HTML5語義化-main:早在 2013 年，<main> 元素就被正式添加到 W3C HTML規(guī)范中，到目前位置，關(guān)于該元素的定義已經(jīng)很完善了，所以現(xiàn)在是時(shí)候深入了解什么時(shí)候適合使用 <main> 元素了。那么，下面就開始吧。 W3C 規(guī)范 <main> 的主要目的是將 A
推薦度：
導(dǎo)讀HTML5語義化-main:早在 2013 年，<main> 元素就被正式添加到 W3C HTML規(guī)范中，到目前位置，關(guān)于該元素的定義已經(jīng)很完善了，所以現(xiàn)在是時(shí)候深入了解什么時(shí)候適合使用 <main> 元素了。那么，下面就開始吧。 W3C 規(guī)范 <main> 的主要目的是將 A

　早在 2013 年，<main> 元素就被正式添加到 W3C HTML規(guī)范中，到目前位置，關(guān)于該元素的定義已經(jīng)很完善了，所以現(xiàn)在是時(shí)候深入了解什么時(shí)候適合使用 <main> 元素了。那么，下面就開始吧。

　　W3C 規(guī)范

　　<main> 的主要目的是將 ARIA 的地標(biāo)性作用 main 映射到 HTML中的元素。這可以幫助那些屏幕閱讀設(shè)備和輔助設(shè)備知道頁面的主要內(nèi)容是從哪里開始的。W3C 規(guī)范將 <main> 描述為 ：

文檔或應(yīng)用程序的主要內(nèi)容。主內(nèi)容區(qū)域由與文檔的中心主題或應(yīng)用的核心功能的直接相關(guān)或擴(kuò)展的內(nèi)容組成。

　　自從 <main> 元素包含在 HTML 規(guī)定里之后，<body> 元素就還原成了它在 HTML4 中的定義。

The body element represents the content of the document.

　　細(xì)節(jié)

　　使用 <main>元素值得注意的一點(diǎn)是，它在每個(gè)頁面中只能使用一次。為什么要規(guī)定一個(gè)頁面只能使用一次呢？雖然我對(duì)具體的細(xì)節(jié)并不感興趣，但是有些觀點(diǎn)看起來還是比較有意義的。

　　按照規(guī)格，如果你在一個(gè)文檔中試圖使用多個(gè) <main> 標(biāo)簽，那么 W3C validator 會(huì)拋出錯(cuò)誤。

　　<main> 元素的另外一個(gè)規(guī)定是，它不能作為 <article>, <header>, <aside>, <footer>, <nav> 的子元素節(jié)點(diǎn)。

　　使用

　　就像其它的 HTML5 新元素一樣，并不是所有的瀏覽器都能夠識(shí)別出 <main> ，并且給它加上預(yù)設(shè)的樣式，你可能需要在自己的 CSS文件中將它設(shè)置為塊級(jí)元素。

main {display:block;}

　　有的時(shí)候，為了支持一些較低版本的 IE 瀏覽器，你可能還需要使用 JavaScript 創(chuàng)建該元素。

<script type="text/javascript">document.createElement('main');</script>

　　當(dāng)然了，你還可以使用 html5shiv.

　　使用 <main> 元素最簡(jiǎn)單的方式就是去替換那些 ID 或者 Class 值為 main 或者 content 之類的<div> 元素。

　　所以，在實(shí)踐中它應(yīng)該是什么樣子呢？下面是使用 <main> 元素之前的文檔結(jié)構(gòu)。

<header>Header</header>
 <div id="content">Main Content</div>
 <footer>Footer</footer>

　　下面使用 <main> 元素改寫文檔。

 <header>Header</header>
 <main id="content">Main Content</main>
 <footer>Footer</footer>

　　好了，這是如此的簡(jiǎn)單，以至于一分鐘不到我們就可以將文檔改寫成新潮的 HTML5 樣式。

　　總結(jié)

　　正如你所見的，使用 <main> 元素是超級(jí)簡(jiǎn)單的，只需要話費(fèi)幾分鐘的時(shí)間，所以現(xiàn)在真的到了將 <main>帶入到網(wǎng)站開發(fā)的過程中了。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文檔

HTML5語義化-main

HTML5語義化-main:早在 2013 年，<main> 元素就被正式添加到 W3C HTML規(guī)范中，到目前位置，關(guān)于該元素的定義已經(jīng)很完善了，所以現(xiàn)在是時(shí)候深入了解什么時(shí)候適合使用 <main> 元素了。那么，下面就開始吧。 W3C 規(guī)范 <main> 的主要目的是將 A
推薦度：
標(biāo)簽： html5 html main
  • 熱門焦點(diǎn)

最新推薦

猜你喜歡

熱門推薦

專題
Top