不朽情缘大奖截图

書名： HTML5+CSS3+jQuery Mobile APP與移動網站設計從入門到精通
作者名：新視角文化行
本章字數： 1819字
更新時間： 2019-10-23 16:45:08

1.1 HTML基礎

HTML主要運用標簽使頁面文件顯示出預期的效果，也就是在文本文件的基礎上，加上一系列的網頁元素展示效果，最后形成后綴名為.htm或.html的文件。通過瀏覽器閱讀HTML文件時，瀏覽器負責解釋插入到HTML文件中的各種標簽，并以此為依據顯示內容，把HTML語言編寫的文件稱為HTML文本，HTML語言即網頁的描述語言。

1.1.1 HTML概述

在介紹HTML語言之前，不得不介紹World Wide Web（萬維網）。萬維網是一種建立在因特網上的、全球性的、交互的、多平臺的和分布式的信息資源網絡。它采用HTML語法描述超文本（Hypertext）文件。Hypertext一詞有兩個含義：一個是鏈接相關聯的文件，另一個是內含多媒體對象的文件。

HTML的英文全稱是Hyper Text Markup Language，中文通常稱為超文本標記語言，HTML是Internet中用于編寫網頁的主要語言，HTML提供了精簡而有力的文件定義，可以設計出多姿多彩的超媒體文件。通過HTTP通信協議，HTML文件得以在萬維網上進行跨平臺的文件交換。

提示

HTML文件可以直接由瀏覽器解釋執行，無須編譯。當用瀏覽器打開網頁時，瀏覽器讀取網頁中的HTML代碼，分辨其語法結構，然后根據解釋的結果顯示網頁內容，正是因為如此，網頁顯示的速度同網頁代碼的質量有很大的關系，保持精簡和高效的HTML源代碼是十分重要的。

1.1.2 HTML特性

HTML文件制作簡單，且功能強大，支持不同數據格式的文件導入，主要有以下幾個特點。

（1）HTML文檔容易創建，只需要一個文本編輯器就可以完成。

（2）HTML文件存儲容量小，能夠盡可能快速地在網絡中進行傳輸和顯示。

（3）HTML文件與操作平臺無關，HTML獨立于操作系統平臺，能夠與多種平臺兼容，只需要一個瀏覽器就可以在操作系統中瀏覽網頁文件。

（4）簡單易學，不需要很深的編程知識。

（5）HTML具有擴展性，HTML的廣泛應用帶來了加強功能、增加標識符等要素，HTML采取了類元素的方式，為系統擴展提供了保證。

1.1.3 HTML文檔結構

編寫HTML文件的時候，必須遵循HTML的語法規則。一個完整的HTML文件由標題、段落、列表、表格、單詞和嵌入的各種對象所組成。這些邏輯上統一的對象統稱為元素，HTML使用標簽來分割并描述這些元素。實際上，整個HTML文件就是由元素與標簽組成的。

HTML文件基本結構如下。

<html>                  <!--HTML文件開始-->
   <head>               <!--HTML文件的頭部開始-->
頭部內容
   </head>              <!--HTML文件的頭部結束-->
   <body>               <!--HTML文件的主體開始-->
主體內容
   </body>              <!--HTML文件的主體結束-->
</html>                 <!--HTML文件結束-->

可以看到，代碼分為3部分。

1. <html>……</html>

告訴瀏覽器HTML文件的開始和結束，<html>標簽出現在HTML文檔的第一行，用來表示HTML文檔的開始。</html>標簽出現在HTML文檔的最后一行，用來表示HTML文檔的結束。兩個標簽一定要一起使用，網頁中的其他內容都需要放在<html>與</html>之間。

2. <head>……</head>

網頁的頭標簽，用來定義HTML文檔的頭部信息，該標簽也是成對使用的。

3. <body>……</body>

在<head>標簽之后就是<body>與</body>標簽了，該標簽也是成對出現的。<body>與</body>標簽之間為網頁主體內容和其他用于控制內容顯示的標簽。

1.1.4 HTML的基本語法

絕大多數元素都有起始標簽和結束標簽，在起始標簽和結束標簽之間的部分是元素體，如<body>…</body>。每一個元素都有名稱和可選擇的屬性，元素的名稱和屬性都在起始標簽內進行設置。

1. 普通標簽

普通標簽是由一個起始標簽和一個結束標簽所組成的，其語法格式如下。

<x>內容</x>

其中，x代表標簽名稱。<x>和</x>就如同一組開關：起始標簽<x>為開啟某種功能，而結束標簽</x>（通常為起始標簽加上一個斜線/）為關閉功能，受控制的內容便放在兩標簽之間，如下面的代碼。

<b>加粗文字</b>

標簽之中還可以附加一些屬性，用來實現或完成某些特殊效果或功能，如下面的代碼。

<x a1="v1"， a2="v2"，……an="vn">內容</x>

其中，a1，a2……，an為屬性名稱，而v1，v2……，vn則是其所對應的屬性值。屬性值加不加引號，目前所使用的瀏覽器都可接受，但根據W3C的新標準，屬性值是需要加引號的，所以讀者最好養成加引號的習慣。

2. 空標簽

雖然大部分的標簽是成對出現的，但也有一些是單獨存在的，這些單獨存在的標簽稱為空標簽，其語法格式如下。

<x>

同樣，空標簽也可以附加一些屬性，用來完成某些特殊效果或功能，如下面的代碼。

<x al="v1"，a2="v2"，……，an="vn">

如下面的代碼。

<hr color="#0000FF">

提示

HTML還有其他更為復雜的語法，使用技巧也非常多，作為一種語言，它有很多的編寫原則并且以很快的速度發展著。

1.1.5 HTML編寫注意事項

HTML由標簽和屬性構成，在編寫HTML文檔時，需要注意以下6點。

（1）“<”和“>”是任何標簽的開始和結束。元素的標簽需要使用這對尖括號括起來，并且在結束標簽的前面加上符號“/”，如<p></p>。

（2）在HTML代碼中不區分大小寫。

（3）任何空格和回車在HTML代碼中均不起作用。為了使HTML代碼更加清晰，建議不同的標簽之間使用回車進行換行。

（4）在HTML標簽中可以添加各種屬性設置，如下面的HTML代碼。

<p align="center">這里是段落文本</p>

（5）需要正確的輸入HTML標簽。輸入HTML標簽時，不要輸入多余的空格，否則瀏覽器可能無法識別這個標簽，導致無法正確地顯示。

（6）在HTML代碼中合理地使用注釋。注釋語句只會出現在HTML代碼中，不會在瀏覽器中顯示。

官术网_书友最值得收藏!