Web前端HTML教程-讓你輕松進(jìn)入Web世界
超文本標(biāo)記語言(Hyper?Text?Markup?Language)，簡稱HTML，標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用。HTML 不是一種編程語言，而是一種標(biāo)記語言 (markup language)，是網(wǎng)頁制作所必備的。
“超文本”就是指頁面內(nèi)可以包含圖片、鏈接，甚至音樂、程序等非文字元素。超文本標(biāo)記語言(或超文本標(biāo)簽語言)的結(jié)構(gòu)包括“頭”部分、和“主體”部分，其中“頭”部提供關(guān)于網(wǎng)頁的信息，“主體”部分提供網(wǎng)頁的具體內(nèi)容。
您可以使用 HTML 來建立自己的 WEB 站點，HTML 運行在瀏覽器上，由瀏覽器來解析。
在本系列教程中，將學(xué)習(xí)如何使用 HTML 來創(chuàng)建站點，帶你快速學(xué)會HTML。其中包含了大量的實踐經(jīng)驗，將知識系統(tǒng)化，濃縮為精華，用通俗易懂的語言直指網(wǎng)頁設(shè)計初學(xué)者的痛點。
好了，廢話不多說，現(xiàn)在跟著 HTML教程的步伐，讓我們一起走進(jìn) HTML 的世界。
HTML語言特點
超級文本標(biāo)記語言文檔制作不是很復(fù)雜，但功能強大，支持不同數(shù)據(jù)格式的文件鑲?cè)?，這也是萬維網(wǎng)（WWW）盛行的原因之一，其主要特點如下：
● 簡易性：超級文本標(biāo)記語言版本升級采用超集方式，從而更加靈活方便。
●?可擴展性：超級文本標(biāo)記語言的廣泛應(yīng)用帶來了加強功能，增加標(biāo)識符等要求，超級文本標(biāo)記語言采取子類元素的方式，為系統(tǒng)擴展帶來保證。
● 平臺無關(guān)性：雖然個人計算機大行其道，但使用MAC等其他機器的大有人在，超級文本標(biāo)記語言可以使用在廣泛的平臺上，這也是萬維網(wǎng)（WWW）盛行的另一個原因。
● 通用性：另外，HTML是網(wǎng)絡(luò)的通用語言,一種簡單、通用的全置標(biāo)記語言。它允許網(wǎng)頁制作人建立文本與圖片相結(jié)合的復(fù)雜頁面，這些頁面可以被網(wǎng)上任何其他人瀏覽到，無論使用的是什么類型的電腦或瀏覽器。?
?
什么時候用HTML
B（Browser）/S（Server）架構(gòu)方向，也是我們以后主攻方向
?
為什么要學(xué)HTML
我們以后主要為企業(yè)內(nèi)部提供解決方案，例如：企業(yè)內(nèi)部的辦公系統(tǒng)、供應(yīng)鏈管理系統(tǒng)、客戶關(guān)系管理系統(tǒng)等，而這些系統(tǒng)通常對界面的表現(xiàn)要求較低，對業(yè)務(wù)處理和數(shù)據(jù)處理要求較高，并且要求降低升級維護(hù)的成本，B/S架構(gòu)可以更好的被企業(yè)接受，所以我們以后主要的方向是開發(fā)基于B/S架構(gòu)的應(yīng)用，B/S架構(gòu)的開發(fā)通常又被叫做Web開發(fā)，Web開發(fā)通常包括Browser瀏覽器端的開發(fā)以及Server服務(wù)器端的開發(fā)。
雖然我們是學(xué)習(xí)Java后臺服務(wù)器編程，但是前端頁面編寫要了解，能看懂，簡單的頁面效果可以實現(xiàn)即可；
?
怎么開發(fā)HTML
創(chuàng)建一個以 .html或 .htm 結(jié)尾的文件，用文本編輯器打開就可以開發(fā)
?
怎么運行HTML
用瀏覽器打開以.html或.htm的文件就可以自上而下解析執(zhí)行，不需要編譯
?
DTD：Document Type Definition
● <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
● DTD文件的作用
● 幫助你編寫合法的代碼
● 它讓瀏覽器正確地顯示器代碼，或者說DTD只是寫給檢查器看的
?
HTML與W3C（World Wide Web:www）
HTML規(guī)范是由w3c負(fù)責(zé)制定的，W3C是世界萬維網(wǎng)聯(lián)盟（World Wide Web:www）
?
安裝瀏覽器
FireFox、Google、IE
HTML元素
HTML標(biāo)簽
<>表示開始標(biāo)記
</>表示結(jié)束標(biāo)記
<html>開始標(biāo)簽
</html>結(jié)束標(biāo)簽
html為元素
HTML 元素指的是從開始標(biāo)簽（start tag）到結(jié)束標(biāo)簽（end tag）的所有代碼。
HTML 元素語法
● HTML 元素以開始標(biāo)簽起始
● HTML 元素以結(jié)束標(biāo)簽終止
● 元素的內(nèi)容是開始標(biāo)簽與結(jié)束標(biāo)簽之間的內(nèi)容
● 某些 HTML 元素具有空內(nèi)容（empty content）
● 空元素在開始標(biāo)簽中進(jìn)行關(guān)閉（以開始標(biāo)簽的結(jié)束而結(jié)束）
● 大多數(shù) HTML 元素可擁有屬性?
?
嵌套 HTML 元素
大多數(shù) HTML 元素可以嵌套（可以包含其他 HTML 元素）。
HTML 文檔由嵌套的 HTML 元素構(gòu)成。
?
HTML 文檔實例
?
HTML 實例解釋
● <p> 元素：
這個 <p> 元素定義了 HTML 文檔中的一個段落。
這個元素?fù)碛幸粋€開始標(biāo)簽 <p>，以及一個結(jié)束標(biāo)簽 </p>。
元素內(nèi)容是：This is my first paragraph。
● <body> 元素：
<body> 元素定義了 HTML 文檔的主體。
這個元素?fù)碛幸粋€開始標(biāo)簽 <body>，以及一個結(jié)束標(biāo)簽 </body>。
元素內(nèi)容是另一個 HTML 元素（p 元素）。
?
<html> 元素：
這個元素?fù)碛幸粋€開始標(biāo)簽 <html>，以及一個結(jié)束標(biāo)簽 </html>
元素內(nèi)容是另一個 HTML 元素（body 元素）。
不要忘記結(jié)束標(biāo)簽
即使您忘記了使用結(jié)束標(biāo)簽，大多數(shù)瀏覽器也會正確地顯示 HTML：
上面的例子在大多數(shù)瀏覽器中都沒問題，但不要依賴這種做法。忘記使用結(jié)束標(biāo)簽會產(chǎn)生不可預(yù)料的結(jié)果或錯誤。
注釋：未來的 HTML 版本不允許省略結(jié)束標(biāo)簽。
?
空元素
有一些元素必須使用單個標(biāo)簽表示。這些被稱為空元素。
一個這樣的元素是?hr?。
hr?是一個分組元素，用于表示一個段落級別的內(nèi)容。
您可以使用以下兩種方式之一使用void元素 - 第一種方法是僅指定開始標(biāo)記，如以下代碼所示。
瀏覽器知道hr是一個void元素，因此不希望看到結(jié)束標(biāo)記。
您可以使元素與空元素一致，如下面的代碼所示。
HTML注釋
注釋是關(guān)于HTML元素的有用信息。注釋使HTML文檔更易讀和可理解。
HTML中的注釋以標(biāo)簽<！-- ?開頭，并以??-->?結(jié)尾。
瀏覽器將忽略您在這些標(biāo)記中放置的任何內(nèi)容。
以下代碼具有HTML注釋。
HTML標(biāo)簽
超文本標(biāo)記語言（外國語簡稱：HTML）標(biāo)記標(biāo)簽通常被稱為HTML標(biāo)簽，HTML標(biāo)簽是HTML語言中最基本的單位，HTML標(biāo)簽是HTML（標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用）最重要的組成部分。
HTML標(biāo)簽的大小寫無關(guān)的，例如“主體”<body>跟<BODY>表示的意思是一樣的，推薦使用小寫。
實例
標(biāo)簽定義及使用說明
<html> 標(biāo)簽告知瀏覽器這是一個 HTML 文檔。
<html> 標(biāo)簽是 HTML 文檔中最外層的元素。
<html> 標(biāo)簽是所有其他 HTML 元素（除了 <!DOCTYPE> 標(biāo)簽）的容器。
?
瀏覽器支持
?
?
段落標(biāo)簽：<p></p>
定義：可以把 HTML 文檔分割為若干段落
?
標(biāo)題字：<h1></h1>至<h6></h6>
標(biāo)題是通過 <h1> - <h6> 等標(biāo)簽進(jìn)行定義的
<h1>定義最大標(biāo)簽，<h6>定義最小標(biāo)簽
?
換行：<br>
定義：<br> 可插入一個簡單的換行符
<br> 標(biāo)簽是空標(biāo)簽，它沒有結(jié)束標(biāo)簽
?
注釋：<!-- 這是HTML注釋 -->
水平線：<hr/>
預(yù)留格式<pre>內(nèi)容</pre>
定義：頁面中輸入什么樣式就顯示什么樣式
實例：< >
最后奉上視頻教程??，視頻觀看效果更佳?。∽哌^路過別忘素質(zhì)三連哦~~
