中文字幕亚洲欧美一区_国产JIZZJIZZ免费看_亚洲av大码在线_亚洲黄色一级毛片_野花影视大全在线观看免费_欧美一区二区三区免费不卡_欧美日韩国产在线精品_国产福利盒子在线看片_精品国产人成在线_日韩欧美动漫一区在线

咨詢電話：024-31891684

網(wǎng)站建設(shè)|注冊|登錄 | 易勢大連分公司

沈陽做網(wǎng)站、沈陽建站易勢最專業(yè)！

 

build網(wǎng)站制作當(dāng)前位置：首頁>主要服務(wù)>網(wǎng)站制作

網(wǎng)站制作技術(shù)之HTML5標簽解析（二）

媒體元素

<section>和< article>標簽還可以包含各種媒體元素，HTML5提供的標簽立刻就傳達了其內(nèi)容的意思。媒體元素，比如說音樂和視頻，以前只能嵌入，但現(xiàn)在能夠被更精準地標識出來。

<audio>標簽標識了聲音內(nèi)容，比如說音樂或是任何的其他音頻流。<audio>標簽有一些屬性用來控制音頻的內(nèi)容、何時以及如何播放等方面的情況，這些屬性分別是：src、preload、control、loop和autoplay。在清單6給出的例子中，只要頁面一加載音頻就開會播放，其會持續(xù)播放，所提供的控制可以讓用戶停止或是重新開始播放音頻。

清單6. <audio>標簽的例子

<audio src="MyFirstMusic.ogg" kesrc="MyFirstMusic.ogg" controls autoplay loop>
Your browser does not support the audio tag.
</audio>

< video>標簽允許你播放視頻片段或是流化視覺媒體。其擁有< audio>標簽所有的屬性，另外再加上三個：poster、width和height。當(dāng)視頻正在加載或是視頻處于完全沒有加載的糟糕情況中時，poster屬性可讓你找出一張圖像來應(yīng)付著先。

清單7提供了一個< video>標簽結(jié)構(gòu)的例子

清單7. 標簽的例子

<video src="MyFirstMovie.ogg" kesrc="MyFirstMovie.ogg" controls="controls">
Your browser does not support the video tag
</video>

<video>和<audio>標簽可以包含< source>標簽，該標簽定義了< video>和< audio>標簽的多媒體資源。使用這一元素，你可以指定替代的視頻或是音頻文件，然后瀏覽器就可以基于它的媒體類型或是所支持的編解碼器來從中進行選擇。清單8中有兩種選擇，如果文件的WMA版本不能在所使用的瀏覽器中播放的話，就再嘗試MP3版本。否則的話就顯示信息，這樣用戶就知道為什么音頻不可用了。

清單8. <source>標簽的例子

<audio>
<source src="/music/good_enough.wma" kesrc="/music/good_enough.wma" type="audio/x-ms-wma">
<source src="/music/good_enough.mp3" kesrc="/music/good_enough.mp3" type="audio/mpeg">
<p>Your browser does not support the HTML ′audio′ element.< /p>
</audio>

<embed>標簽定義了可帶入到頁面中的嵌入式內(nèi)容——例如， 一個Adobe Flash SWF文件的插件。清單9包含了type屬性，標明嵌入的資源為Flash文件。

清單9. <embed>標簽的例子

<embed src=”MyFirstVideo.swf” kesrc=”MyFirstVideo.swf” type=”application/x-shockwave-flash”/>

除了src和type屬性之外，<embed>標簽還擁有height和width屬性。

Aside區(qū)

Acme United規(guī)劃中的Aside區(qū)可通過使用<aside>標簽來創(chuàng)建。這一標簽被看作是用來存放補充內(nèi)容的地方，這些內(nèi)容不是其所補充的一篇連續(xù)文章的組成部分。在雜志上，插入語（aside）通常被用來突出文章本身所制造的一個觀點。< aside>標簽包含的內(nèi)容可被刪除，而這不會影響到包含了該內(nèi)容的文章、章節(jié)或是頁面所要傳達的信息。

清單10提供了<aside>標簽用法的一個例子。

清單10. <aside>標簽的例子

<p>My family and I visited Euro Disney last year.</p>
<aside>
<h4>Disney in France< /h4>
<p>Besides Euro Disney, there is a Disneyland in California.< /p>
</aside>

Footer區(qū)

<footer>元素包含了與頁面、文章或是部分內(nèi)容有關(guān)的信息，比如說文章的作者或是日期。作為頁面的頁腳，其有可能包含了版權(quán)或是其他重要的法律信息，如清單11所示。

清單11. <footer>標簽的例子

<footer>
<p>Copyright 2011 Acme United. All rights reserved.< /p>
</footer>

那么，讓我們把頁面裝配起來吧。首先要處理的是這個<!doctype>，在HTML5中，<!doctype>被簡化了：所有你需要記住就是html。這不僅是簡化了這一標簽的條目，而還把它變得更適應(yīng)未來的發(fā)展。需要注意的是，它不是被稱為html5，就只是html。不管來來去去的有多少個HTML版本，<!doctype>可以一直都是html。

<html>標簽包含了所有除了<!doctype>標簽之外的其他HTML元素，其他的每一個元素都必須嵌套在< html>和< /html>標簽之間，參見清單12。

清單12. <!doctype>標簽的例子

<!doctype html>
<html lang="en">

在指出了html和語言為英語之后，你就可以使用<head>元素，該元素可以包含腳本、瀏覽器支持信息、樣式表鏈接、meta信息和其他的初始化函數(shù)。你可以在head這一區(qū)域中使用這些標簽：

1. <base>
2. <link>
3. <meta>
4. <script>
5. <style>
6. <title>

<title>標簽存放文檔的實際標題，這是一個必需的< head>區(qū)元素，它的內(nèi)容就是你在瀏覽該頁面時會在瀏覽器的頂端看到的標題。清單13中的< link>標簽標識了會被用來渲染HTML5頁面的CSS3樣式表，樣式表的文件名為main-stylesheet.css。

上一條資訊|返回欄目頁|下一條資訊

易勢沈陽建站專業(yè)機構(gòu)，以DIV+CSS為主，js/jQuery為輔，制作利于優(yōu)化，頁面美觀的優(yōu)質(zhì)網(wǎng)站！

top

網(wǎng)絡(luò)策劃公司|新浪官方微博|大連網(wǎng)站建設(shè)