HTML5＆CSS3現實世界，第二版

鑰匙要點

• > HTML5和CSS3旨在確保與較舊瀏覽器的向後兼容，這意味著對標記的更改不會導致佈局問題或錯誤。即使較舊的瀏覽器不完全支持新功能，它們也不會打破頁面或引起明顯的問題。 HTML5和CSS3在許多移動網絡瀏覽器中得到了很好的支持，使其非常適合快速增長的移動市場。 HTML5和CSS3中引入的一些新技術，例如離線網絡應用程序和Web存儲，專門設計了移動設備的設計。
> HTML5和CSS3允許創建功能強大，易於維護的，防止未來的網頁。隨著較舊的瀏覽器不使用，開發人員只需要刪除任何後備和多填充物，而將代碼庫瞄準了現代瀏覽器。
• >以下是我們的書《現實世界的HTML5＆CSS3》中的摘錄，第二版，由Alexis Goldstein，Louis Lazaris和Estelle Weyl撰寫。副本在全球範圍內出售，或者您可以在此處以電子書形式購買。

> HTML5對內容的標記方式產生了重大變化，但值得注意的是，這些更改不會導致較舊的瀏覽器扼殺，也不會導致佈局問題或頁面錯誤。 這意味著您可以採用任何包含有效HTML4或XHTML標記的舊項目，將Doctype更改為HTML5（我們將在第2章中介紹），並且該頁面將在瀏覽器中顯示與其相同前。 HTML5中的更改和添加已被實施到該語言中，以確保與較舊的瀏覽器（甚至較舊版本的Internet Explorer）向後兼容！當然，這不能保證新功能會起作用，這只是意味著它們不會打破您的頁面或引起任何明顯的問題。 即使在更複雜的新功能（例如API）方面，開發人員也提出了各種解決方案，以提供與非支持瀏覽器的同等體驗，同時也擁抱HTML5和CSS3提供的令人興奮的新可能性。有時，這與提供後備內容一樣簡單，例如在沒有本機視頻支持的情況下瀏覽閃光視頻播放器。但是，在其他時候，有必要使用腳本來模仿新功能的支持。這些“填充”技術被稱為多填充技術。在構建高性能的Web應用程序時，依靠腳本模仿本地功能並不總是最好的方法，但是隨著我們發展以包括新的增強和功能，這是一種必要的痛苦，例如我們將在本書中討論的痛苦。幸運的是，在撰寫本文時，如今，不到10％的網絡訪問者使用了較早的瀏覽器，例如Internet Explorer 6至9，這些瀏覽器無法支持HTML5和CSS3中的許多新功能。越來越多的人正在使用所謂的常綠瀏覽器；也就是說，瀏覽器會自動更新。這意味著新功能將對更大的受眾群體起作用，並最終對所有人都起作用，因為較舊的瀏覽器分享了下降。

>在本書中，我們有時可能會推薦後備選項或polyfills來填充瀏覽器不兼容的空白；我們還將盡力警告您與使用這些選項相關的潛在缺點和陷阱。

當然，值得注意的是，有時根本不需要後備或多填充。例如，當使用CSS3在設計中的框上創建圓角時，實際上舊瀏覽器的用戶通常不會看到方形盒子。網站的功能沒有降解，這些用戶對所缺少的東西不太明智。

>當我們在課程中進行介紹並介紹新主題時，如果您打算在項目中使用其中一個，我們強烈建議您諮詢瀏覽器支持參考，例如上述，我可以使用……知道如何以及是否提供後備還是多填充。在必要時，我們偶爾會討論您可以確保非支持瀏覽器具有可接受的經驗的方式，但是好消息是隨著時間的流逝，它變得越來越越來越越來越少。

不斷增長的移動市場

>今天開始學習和使用HTML5和CSS3的另一個令人信服的理由是爆炸的移動市場。根據一個消息來源，2009年，所有網絡使用情況的不到1％是在移動設備和平板電腦上。到2014年中期，這個數字已上升到35％以上！這是五年多的驚人增長率。那麼，這對學習HTML5和CSS3的人意味著什麼？ 在許多移動Web瀏覽器中，實際上，我們將在本書中介紹的一些新技術是專門針對移動設備設計的。由於越來越多的人使用移動設備訪問網頁，因此設計了諸如離線Web應用程序和Web存儲之類的技術。此類設備通常可以使用在線數據使用情況下限制，從而從脫機訪問Web應用程序的能力中受益匪淺。

>我們將在第11章中介紹這些主題，以及在本書的整個過程中，提供了為各種設備和平台創建網頁所需的工具。 >

到真實的東西

>不切實際，邁向新技術，並希望只為一個級別的瀏覽器撰寫頁面和應用程序。在現實世界中，在一個希望HTML5和CSS3進一步侵害的世界中，我們需要準備開發各種景觀的頁面。該景觀包括現代瀏覽器，任何剩餘的舊版本的互聯網瀏覽器以及移動設備的爆炸市場。

是的，在某些方面，為不同的用戶代理提供了一套不同的說明，類似於Web的早期，其雜亂的瀏覽器嗅探和代碼分叉。但是這次，新的代碼更具未來的範圍：當較舊的瀏覽器掉入一般用途時，您需要做的就是刪除任何後備和多填充物，僅留下針對現代瀏覽器的代碼庫。

>

> HTML5和CSS3是領先的技術，它迎來了一個更令人興奮的網頁創作世界。由於所有現代瀏覽器都為許多HTML5和CSS3功能提供了極好的支持，因此創建強大而易於維護的未來的網頁比以往任何時候都更容易。

>

>因此，關於“為什麼”的足夠，讓我們開始挖掘“如何”！

>

經常詢問有關HTML5和CSS3

的問題

HTML5和CSS3？

HTML5和CSS3之間的關鍵區別是什麼，都是網絡開發的必不可少的工具，但它們具有不同的目的。 HTML5是一種標記語言，用於在網絡上構建和呈現內容。它介紹了反映現代網站上典型用法的新元素和屬性。另一方面，CSS3是一種樣式表語言，用於描述用HTML編寫的文檔的外觀和格式。它介紹了新功能，例如圓角，陰影，漸變，過渡，動畫等。

>

>我如何開始學習html5和css3？

HTML5和CSS3。 Codecademy，Udemy和Khan Academy等網站提供互動課程。您也可以參考在線文檔和教程。練習是掌握這些語言的關鍵，因此請嘗試構建自己的網站或改進現有語言。

使用HTML5和CSS3？

html5和CSS3有幾個好處。它們可以進行更清潔，更有效的編碼，提高性能和更好的可訪問性。他們還提供了更高級的功能和更大的靈活性設計和自定義網站。此外，它們得到了所有現代瀏覽器的支持。

>我可以將HTML5和CSS3用於移動Web開發嗎？

是的，HTML5和CSS3是移動Web開發的絕佳工具。它們提供了諸如視口元標籤之類的功能，該功能允許控制視口的大小和尺度以及媒體查詢，從而允許內容渲染以適應諸如屏幕分辨率之類的條件。他們還支持觸摸事件，這些事件對於移動接口至關重要。

>在使用HTML5和CSS3和CSS3？

>時，有些共同的挑戰是什麼，有些共同的挑戰包括瀏覽器兼容性問題，因為並非所有瀏覽器都支持所有瀏覽器，所有HTML5和CSS3功能。同樣，由於這些仍在不斷發展的技術，因此跟上最新更改可能具有挑戰性。此外，實現所需的佈局和設計有時會很複雜且耗時。

如何確保我的HTML5和CSS3代碼有效且無錯誤？就像W3C標記驗證服務一樣，檢查您的HTML5代碼以及CSS3代碼的CSS驗證服務。這些工具將在您的代碼中確定任何錯誤或問題。

>編寫HTML5和CSS3代碼的一些最佳實踐是什麼？

>

一些最佳實踐包括使用HTML5中的語義元素以提高可訪問性和SEO ，保持CSS3代碼乾燥（不要重複自己），並以使其易於閱讀和維護的方式組織代碼。另外，請始終確保您的代碼有效且無錯誤。

>我可以將HTML5和CSS3與其他編程語言一起使用？

是的，是，HTML5和CSS3可以與其他編程語言結合使用像JavaScript，PHP和Ruby一樣。它們用於構造和样式內容，而其他語言處理網站的功能和行為。

>我如何使用HTML5和CSS3？

以上是HTML5＆CSS3現實世界，第二版的詳細內容。更多資訊請關注PHP中文網其他相關文章！