
HTML5 figure 標簽的定義和用法:
figure 標簽用于對元素進行組合。
figure 標簽規定獨立的流內容(圖像、圖表、照片、代碼等等)。
figure 元素的內容應該與主內容相關,同時元素的位置相對于主內容是獨立的。如果被刪除,則不應對文檔流產生影響。
HTML5 figure 標簽的實例:
文檔中的一個小節,描述 PRC:
figure h1 PRC /h1 p The People s Rehtml' target='_blank'>public of China was born in 1949... /p /figure
提示:請使用 figcaption 元素為元素組添加標題。
figure元素是一種元素的組合,可帶有標題(可選)。figure標簽用來表示網站制作頁面上一塊獨立的內容,將其從網頁上移除后不會對網頁上的其他內容產生影響。figure所表示的內容可以是圖片、統計圖或代碼示例。
注意:一個figure元素內最多只允許放置一個figcaption元素,其他元素可無限放置。
HTML5 figure標簽的作用:
之前看到一個很有趣的輪子:Hover效果,沒有使用 JavaScript 代碼,全部都是 HTML + CSS便實現了,用審查者工具看了下源代碼,發現 HTML 的基本構造如下面所示:
figure >而我實現的源代碼中HTML部分的代碼,實例對比:
div >很顯然的區別是原本代碼中使用了HTML5的新標簽 figure 實現了頁面的基礎搭建,下面就簡單聊聊這個HTML5的新標簽 figure 。
值得一提的是尤其提到獨立于文檔主流之外,是在官方文檔上面提到的,還提到了這個標簽包含的內容應該具有獨立性,可移植的,不影響主流內容。然后前文提到的描述這里就是作為 figure 的可選子標簽 figcaption 中的內容。
現在回到之前我準備重復造的那個輪子,發現如果把對于圖片的描述內容全部都包裹在 figcaption 標簽中,無論是語義上還是代碼結構上都更加的清晰。
HTML 4.01 與 HTML 5 之間的差異
figure 標簽是 HTML 5 中的新標簽。
【相關推薦】
HTML5 progress 標簽是什么意思?HTML5 progress 標簽的基本用法詳解
HTML5中的header標簽是什么意思?HTML5中header標簽具體使用方法你知道嗎?
以上就是HTML5 figure標簽是什么意思?HTML5 figure標簽的使用方法詳解的詳細內容,其它編程語言
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。
新聞熱點
疑難解答