整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
昨天了解計算機基礎知識后，小編今天帶大家學習前端三大腳手架之一的HTML，從常用程度上，HTML可以簡單的分為：基礎HTML、核心HTML。今天將學習基礎HTML（一），因為只有把地基打扎實了，才能建高樓。
首先，什么是HTML？書本上稱為HTML(Hyper Text Markup Language),超級文本標記語言，說白了就是編寫一個網頁的語言；可以想象因為要講話，所以我們學會了文字，同理，因為要編輯網頁，所以我們要學習HTML；HTML是有一系列標記組成，同時也具有自己獨特的語法。通過標記和語法組成后，最終會由瀏覽器負責解釋，瀏覽器中有兩大解析器，html渲染解析器，js解析器（這塊后續會提到）。
HTML的發展進程，從最開始的HTML2.0>HTML3.2>HTML4.0>HTML4.01>XHTML1.0>HTML5；目前HTML已經更新到了HTML5了，HTML5給我們帶來了很多新玩意兒，后面會陸續把好東西分享給大家。
HTML5 質的發展
在今日學習之前，先分析一些開發工具，作為新手，不建議使用具有代碼提示補全的工具，建議使用EditPlus，記事本之類的工具，只有把代碼寫扎實了，再進階到高級工具。
下面進入HTML標簽的學習，也有叫標記的。
一、標簽語法
1、所有的標簽都必須使用尖括號擴起來，例如 <a>,<div> ... <A>,<a>
2、有封閉類型的標簽，也有非封閉類型的標簽
2.1、封閉類型，也稱作雙標記，則必須成對出現；語法規則： <標記>文本內容</標記>； 不同的標記，決定 了"文本內容"的不同表現形式；常見的封閉類型標記有:<a></a>,<p></p>,<div></div>
2.2、非封閉類型，也稱作單標記、空標記；語法規則： <標記>或者<標記/> 常見的非封閉類型標記有: <hr>,<br>,<img>
區別封閉類型和非封閉類型標簽，就看這標簽是一對出現的，還是單個出現的。
3、標簽嵌套
標簽之間可以相互嵌套，形成復雜的語法結構，簡單的例子如下：
<body>
<p>
<a></a>
</p>
</body>
4、標簽屬性，標簽屬性是指出現在開始標記中的內容，作用是修飾元素，如 <div 屬性名="屬性值"></div>
標準屬性：就是每個元素與生俱來就具備的通用屬性，常見的標準屬性有：
id ：定義每個標簽的唯一標識
title：提示文本
class：樣式相關，類樣式
style：樣式相關，行內樣式
現在可以和小編一個編寫一個簡單的標簽，同時設置這個標簽的id屬性為myDIv。（屬性命名方式：駝峰命名，后續會分享給大家）
實戰：第一步：先定義一個標簽div，即<div></div>
第二步：添加id屬性，即<div id="myDIv"></div>
疑問：如果存在多個屬性值怎么辦？怎么添加屬性值是編碼規范的？
答：如果是多屬性的，那么直接在前一個屬性值后繼續編寫，不需要用“，”或者“；”分開，直接寫就對了！而且，多個屬性排名不分先后的，舉個栗子： <div id="myDiv" title="myTitle"></p>
二、文檔結構
1、文檔類型聲明：即聲明使用的HTML版本和風格，HTML5中使用聲明為： <!doctype html>
2、html頁面
2.1、文檔根元素，每個文檔有且僅有一對根元素 , html
2.2、在根元素的內部，包含兩對子元素；
2.2.1、head : 頁面的頭部內容，定義頁面全局信息 包含的內容有：
<title></title> ;網頁標題，就是網頁地址上面顯示的名稱；
<meta />:聲明元數據(編碼,關鍵字,描述)，最重要的搜索引擎SEO主要是寫這部分；同時也可以定義一些網頁屬性，比如說，中文顯示 <meta charset="utf-8" />；
<style></style>:聲明內部樣式表，聲明當前網頁所用到的樣式，這種方式的樣式定義只能運用在當前頁面，其他頁面不能使用這里定義的樣式；
<link />:引入外部樣式表，引入外部定義好的樣式，只要是這個頁面想要用到某一個外部樣式表，就直接引入就可以用了，這種樣式表定義運用彌補上面<style></style>不能共享的缺陷，是的代碼達到了重用的優勢；
<script></script>:定義或引入腳本文件，主要是引入一些js腳本語言，完成這個頁面所需要的交互；
2.2.2、body : 頁面的主體內容，任何一個標簽，都可能會出現在body中；<body>也是標簽，它也可以定義自己的屬性，比如網頁背景有綠色，那么就是<body bgcolor="green"></body>；
3、文本標記
3.1、特殊的文本，除了正常文字外，在一些特定的情況下會需要有特別的標點符號等，小編舉例幾個常見的特殊符號的標記，如 空格對應的是“ ”、 <對應的是 “<” 可以理解為less than 、> 對應的是 “> ”理解為greater than、 版權標識對應的是 “©”，這里需要特別特別注意的一點是 每個特殊字符有需要“；”
3.2、文本標記
3.2.1、文本樣式
<b>...</b>： 加粗文本；
<i>...</i>：斜體文本；
<u>...</u>：下劃線；
<s>...</s>：刪除線；
<sup>...</sup>：上標；
<sub>...</sub>：下標；
3.2.2、標題元素， 1-6級6個標題 <hn></hn> n：1-6 其中一級是最大的， 六級是最小的；
3.2.3、段落元素，提供了結構化文本的表現方式， 語法：<p></p>， 注意：每對p標簽單獨成一個段落，常用屬性:
align：水平對齊方式 取值：left center right；
4、換行元素，在代碼的任何位置處，實現回車的效果 <br />，是非封閉類型標記；
5、水平線， 又叫分割線， <hr /> 也是非封閉類型標記，常用屬性；
5.1、size ：水平線的粗細，通常以像素(px)為單位；
5.2、width：寬度；
5.3、align：水平線的水平對齊方式；
5.4、color：顏色；
6、分區元素目的：為元素進行分組，多數用在布局中；
塊分區元素：<div></div> ；
行內分區元素：<span></span>；
注意：
div ：主要用在布局上；
span：修改其內部內容的樣式；
7、預格式化，保留源文檔中的空格和回車 <pre>文本內容 </pre>；
8、注釋
可以寫在html源碼中，但不被瀏覽器解釋的文本；
語法： <!-- 注釋內容 -->
！！！特別注意：行內元素與塊級元素
塊級元素：默認情況下，塊級元素獨占一行，元素的前后都會自動換行 div、hn、hr、p等 主要用于布局。
行內元素:默認情況，多個元素位于同一行，不會換行，span、文本標記... .主要行內元素作用:修改內部內容的樣式。
最后，小編建議多多打代碼！
預告：下一篇 前端教程之HTML（二）
例
以下代碼標記了一個段落：
<p>這是一個段落。</p>
瀏覽器支持
目前大多數瀏覽器支持 <p>標簽。
標簽定義及使用說明
<p> 標簽定義段落。
<p>元素會自動在其前后創建一些空白。瀏覽器會自動添加這些空間，您也可以在樣式表中規定。
在HTML 4.01 與 HTML5中的差異
HTML 4.01中標簽的 align 屬性已經廢棄，HTML5不支持該屬性。
屬性
| 屬性 | 值 | 描述 |
|---|---|---|
| align | leftrightcenterjustify | HTML5不支持。 HTML 4.01已廢棄。 不贊成使用。請使用樣式取代它。 規定段落中文本的對齊方式。 |
全局屬性
<p> 標簽支持全局屬性，查看完整屬性表 HTML全局屬性。
事件屬性
<p> 標簽支持所有 HTML事件屬性。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039，我們一起飛！
TML，即超文本標記語言(HyperText Markup Language)，是構建網頁和網絡應用的基石。自從它的誕生以來，HTML經歷了多次迭代，每個版本都對Web開發的可能性進行了擴展。以下是HTML發展歷程的概述，包括每個主要版本的變化和未來趨勢。
HTML的歷史可以追溯到1989年，當時**蒂姆·伯納斯-李（Tim Berners-Lee）**在CERN（歐洲核子研究組織）提出了一個創新的想法，即創建一個互聯的信息系統，這個系統后來演變成了萬維網（World Wide Web）。HTML是這個系統的核心組成部分，它允許文檔通過超鏈接互相引用，形成一個信息網絡。
隨著Web技術的不斷發展，HTML也在不斷進化。未來的HTML可能會包括：
HTML的歷史是Web技術發展的縮影。從簡單的文檔標記到復雜的Web應用平臺，HTML已經成為現代互聯網不可或缺的一部分。隨著技術的進步，我們可以期待HTML將繼續演進，以滿足未來網絡世界的需求。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
