今天我們來說說有關于:“在html5中figure和figcaption的使用方法介紹!”這方面的內(nèi)容,下面是小編整理的相關內(nèi)容,希望可以幫助到大家們。
figure 標簽和 figcaption標簽是 html5 新增的語義化標簽。
figure標簽,html5語義化標簽。
用于規(guī)定獨立的流內(nèi)容(圖像、圖表、照片、代碼等等)。
figcaption標簽,html5語義化標簽。
與figure配套使用,用于標簽定義 figure 元素的標題。
用figure和figcaption標簽的好處
搜索引擎搜索到figure的時候會知道,這里存放的是圖片、圖表、照片、代碼等媒體,不不會認為這里存放的是文章等其他東西。搜索引擎搜索的時候更快捷更便利。
另一方面程序員在看的時候,看到這個標簽的時候,就會知道,這里存在的就是圖片等媒體,便于閱讀。
下面用圖簡單描述下這兩個標簽的使用方法
案例1:
不帶有標題的 figure 元素:
<figure>
<img alt="W3Cschool" src="logo.png"/>
</figure>
案例2:
帶有標題的 figure 元素:
<figure>
<img alt="W3Cschool" src="logo.png"/>
<figcaption>W3Cschool,W3Cschool是國內(nèi)專業(yè)的網(wǎng)站建設資源、腳本編程學習類網(wǎng)站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批處理、網(wǎng)頁制作、網(wǎng)絡編程、網(wǎng)站建設等編程資料</figcaption>
</figure>
案例3:
多個圖片,同一個標題的 figure 元素:
<figure>
<img alt="W3Cschool1" src="logo1.png"/>
<img alt="W3Cschool2" src="logo2.png"/>
<img alt="W3Cschool3" src="logo3.png"/>
<figcaption>W3Cschool,W3Cschool是國內(nèi)專業(yè)的網(wǎng)站建設資源、腳本編程學習類網(wǎng)站,提供asp、php、asp.net、javascript、jquery、vbscript、dos批處理、網(wǎng)頁制作、網(wǎng)絡編程、網(wǎng)站建設等編程資料</figcaption>
</figure>
那么今天有關于:“在html5中figure和figcaption的使用方法介紹!”這個介紹就到這里了,更多有相關html5方面的內(nèi)容都可以在W3Cschool中進行學習和了解。