HTML5 figure標籤是什麼意思？ HTML5 figure標籤的使用方法你想知道嗎？接下來介紹今天的這篇文章，主要講述了HTML5 figure標籤的定義和用法（附實例）
#HTML5
#
HTML5
文件中的一個小節，描述PRC：
<figure> <h1>PRC</h1> <p>The People's Republic of China was born in 1949...</p> </figure>
提示：請使用
figure元素是一種元素的組合，可帶有標題（可選）。 figure標籤用來表示網站製作頁面上一塊獨立的內容，將其從網頁上移除後不會對網頁上的其他內容產生影響。 figure所表示的內容可以是圖片、統計圖或程式碼範例。
注意：一個figure元素內最多只允許放置一個figcaption元素，其他元素可無限放置。
HTML5 figure標籤的作用：
之前看到一個很有趣的輪子：Hover效果，沒有使用JavaScript 程式碼，全部都是HTML CSS便實現了，用審查者工具看了下原始程式碼，發現HTML 的基本建構如下面所示：
<figure class="effect-julia">
<img src="img/21.jpg" alt="img21"/>
<figcaption>
<h2>Passionate <span>Julia</span></h2>
<div>
<p>Julia dances in the deep dark</p>
<p>She loves the smell of the ocean</p>
<p>And dives into the morning light</p>
</div>
<a href="#">View more</a>
</figcaption>
</figure>而我實作的原始碼中HTML部分的程式碼，實例比較：
<div class="hover-area area-Julia">
<img src="imgs/21.jpg" height="360" width="480">
<h3>PASSIONATE<strong>JULIA</strong></h3>
<ul>
<li>Julia dances in the deep dark.</li>
<li>She loves the smell of the ocean</li>
<li>And dives into the morning light</li>
</ul>
</div>很顯然的差異在於原本程式碼中使用了HTML5的新標籤
值得一提的是尤其提到獨立於文檔主流之外，是在官方文檔上面提到的，還提到了這個標籤包含的內容應該具有獨立性，可移植的，不影響主流內容。然後前文提到的描述這裡就是作為
現在回到之前我準備重複造的那個輪子，發現如果把對於圖片的描述內容全部都包裹在
HTML 4.01 與 HTML 5 之間的差異
【相關推薦】
#HTML5中的header標籤是什麼意思？ HTML5中header標籤具體使用方法你知道嗎？
以上是HTML5 figure標籤是什麼意思？ HTML5 figure標籤的使用方法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
