簡(jiǎn)單的網(wǎng)站建設(shè)
檢測(cè)HTML5函數(shù)的一個(gè)技巧是檢測(cè)什么情況下無法運(yùn)行，而非什么情況K正常運(yùn)作。經(jīng)常會(huì)在出錯(cuò)的頁面上看到提示信息“此頁面僅在IE下可見，請(qǐng)升級(jí)瀏覽器”。顯然，大部分使用非丨E瀏覽器的用戶認(rèn)為他們的瀏覽器才趄“升級(jí)”的版本，也不想只是為了瀏覽一個(gè)
站點(diǎn)而切換成IE。大部分人只是笑一笑，然后再也不會(huì)訪問那個(gè)網(wǎng)站了。

在iE擁有大部分瀏覽器市場(chǎng)占有率時(shí)，期望用戶切換成IE是可以理解的，但現(xiàn)今IE只是許多同樣優(yōu)秀的瀏覽器中的一種，并且根據(jù)市場(chǎng)變化趨勢(shì)，過不了多久IE甚至很可能不再是最受歡迎的瀏覽器。

目前，最好的做法是列出想要提供的特性，并對(duì)網(wǎng)站進(jìn)行降級(jí)處理。這樣，那些較弱的瀏覽器雖然無法使用許多網(wǎng)站功能，但至少可以訪問到一個(gè)有用的站點(diǎn)。此類操作被稱為優(yōu)雅降級(jí)，屬于一種容錯(cuò)機(jī)制。

優(yōu)雅降級(jí)的理念源于系統(tǒng)在一個(gè)或多個(gè)組件錯(cuò)誤時(shí)，應(yīng)當(dāng)仍能繼續(xù)運(yùn)行。在Web開發(fā)中，這意味著即使在HTML5組件無法被瀏覽器完全支持時(shí)Web頁面仍能繼續(xù)運(yùn)作。

<video>標(biāo)簽是一個(gè)不錯(cuò)的例此標(biāo)簽需要瀏覽器同時(shí)支持視頻編解碼器以及<vide〇>標(biāo)簽。只要無法被支持其中一個(gè).視頻就無法播放。在這種情況下可以選擇以卜'方式

>忽略錯(cuò)誤，什么都不顯示或顯示一條錯(cuò)誤信息，即由瀏覽器決定。
>檢測(cè)到錯(cuò)誤并提示用戶升級(jí)瀏覽器。
>檢測(cè)錯(cuò)誤并執(zhí)行回退措施。

最好的選擇是檢測(cè)錯(cuò)誤并執(zhí)行回退措施。各個(gè)瀏覽器和用戶都不相同，可以通過提供替代方案使問題更少。

切記這里并不是要找解決問題的最完美的方案。我們的目的是要讓選用HTML5瀏覽器的用戶覺得物有所值。使用另一種語言完全fi制網(wǎng)站并不是最好的方法，還會(huì)讓工作量成倍增加。

4.5使用CSS3媒體查詢檢測(cè)移動(dòng)瀏覽器
CSS2引入了 media-dependent (媒體類）樣式表，開發(fā)者可以利用它們來為不同的媒體類型創(chuàng)建獨(dú)立樣式表。例如，你可以創(chuàng)建下列樣式表。

>all—所有媒體類型。
>aural——語音合成器。
>braille—盲文裝置。
>embossed——分頁盲文打印機(jī)。
>handheld——小型設(shè)備，通常為單色^
>print——紙張格式及“打印預(yù)覽”。
>projection-投影儀。
>screen-彩色電腦屏幕。
>tty^有固定字符網(wǎng)格的電傳打字設(shè)備。
>tv——A有低分辨率、色彩及聲音的電視設(shè)備。

可以使用media厲性將媒體類型添加至樣式表，從而定義樣式表的媒體類型。
<style media="screen_>
或者將其添加至外聯(lián)樣式表標(biāo)簽。
<link media="screen" rel="stylesheef href="style.css*>

或者用@media標(biāo)簽將樣式添加至己有樣式表中。

<style>

@media print {

// add styles here
}

</style>

CSS3擴(kuò)充了媒體屬性，這樣用戶可以在各種條件下檢測(cè)用戶代理。瀏覽器在滿足條件的情況下可以輸出對(duì)應(yīng)的樣式表。例如，以下代碼可以為小屏幕用戶輸出不同的樣式表。

<link rel="stylesheet" media="screen and (max-width: I28px)"

href=*small-screen.css">
可以通過以K媒體特性來檢測(cè)瀏覽器。    .
>屏幕或設(shè)備的寬度與高度。
>屏幕方向。

>屏幕或設(shè)備的縱橫比。
>顏色及顏色數(shù)景，單色或彩色以及顏色位深。
>分辨率。
>電視設(shè)備掃描進(jìn)程。
>網(wǎng)格或位圖設(shè)備。