HTML是如此的簡單，相信大部分學過HTML的人都是這樣覺得的，不得不說HTML的確沒什么難的，只要幾小時甚至幾十分鐘就能掌握，所以這篇文章我會著重講一點HTML的學前知識。
1.URL
url的中文翻譯是統一資源定位器，通俗來講，就是我們說的路徑，路徑又分為相對路徑和絕對路徑
相對路徑
從文件當前所在位置出發查找目標位置
1、目標文件與當前文件在同一文件夾下，直接寫文件名
src="1.jpg"
2、目標文件在子文件夾下，子文件夾名/文件名
src="images/1.jpg"
3、目標文件在當前文件的上一級目錄，../文件名
src="../1.jpg"
4、目標文件在當前文件的上一級目錄的子目錄里 ../子目錄名/文件名
src="../images/1.jpg"
當目標文件是當前站點下的文件時，可使用相對路徑。
絕對路徑
http://www.sohu.com/images/1.jpg
協議名 主機名 目錄名 文件名
ftp://202.112.111.12/images/1.jpg
協議名 主機IP地址 目錄名 文件名
從最根本的協議開始完整的表述路徑
無論在哪個文件里都能找到目標路徑
當目標文件是其他主機上的文件時，必須使用絕對路徑。
常見的圖片格式
GIF 最多只支持256色。支持動畫
JPG 支持真彩色
PNG 支持透明和半透明，支持真彩色
HTML文件
HTML文件就是以.html、.htm、.xhtml等結尾的文件，用來編寫HTML代碼的
如何在HTML文件中編寫代碼和運行HTML文件
編寫HTML代碼沒有那么多紛繁復雜的配置和安裝軟件，在windows系統中只需要用自帶的文本編輯器即能完成HTML代碼的編寫，也不需要編譯，可以直接在瀏覽器中運行
用文本編輯器打開HTML文件，右擊 --> 打開方式 --> 選擇記事本，即可在記事本開始編寫HTML文件
編寫完HTML代碼并保存后在瀏覽器中運行，同樣右擊 --> 打開方式 --> 選擇瀏覽器，即可在瀏覽器中查看到效果
附：當然，在實際工作中很少會直接使用系統自帶的編輯器編寫，初學者我推薦使用的編輯器可以是EditPlus，sublime text等編輯器
HTML的頭部聲明
頭部聲明我們也叫<!DOCTYPE> 聲明，在 HTML 4.01 中,<!DOCTYPE> 聲明引用 DTD,因為 HTML 4.01 基于 SGML。DTD 是一套關于標記符的語法規則。它是XML1.0版規格得一部分,是html文件的驗證機制,屬于html文件組成的一部分。 DTD 規定了標記語言的規則，這樣瀏覽器才能正確地呈現內容。
HTML5 不基于 SGML，所以不需要引用 DTD。
DTD：三種文檔類型：S（Strict）、T（Transitional）、F（Frameset）。
Strict：如果您需要干凈的標記，免于表現層的混亂，請使用此類型。請與層疊樣式表（CSS）配合使用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Transitional：DTD 可包含 W3C 所期望移入樣式表的呈現屬性和元素。如果您的讀者使用了不支持層疊樣式表（CSS）的瀏覽器以至于您不得不使用 HTML 的呈現特性時使用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Frameset： DTD 應當被用于帶有框架的文檔。除 frameset 元素取代了 body 元素之外，Frameset DTD 等同于 Transitional DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
html5作為現在的主流方向，他的頭部聲明簡單明了
<!DOCTYPE HTML>
這就是HTML5的頭部聲明了
HTML的結構
在HTML的結構中除卻頭部聲明，他由一個html標簽包裹，里面分為頭標簽head和主體標簽body
<!DOCTYPE HTML>
<html>
<head>
這是頭部
</head>
<body>
這是主體
</body>
</html>
這些是每個HTML文件必須包含的元素
HTML標簽的屬性和屬性值
HTML標簽的屬性是用來描述標簽的一些特性的，前一篇文章我們介紹到，標簽就像一個個盒子，那么這些盒子必定會有不同的作用和形態以及材料，比如裝水的瓶，它可以是玻璃的材料，長圓柱形；裝餅干的盒子，它可以是鐵的，長四方體。HTML的標簽也是如此，不過它是用屬性來描述這些特性，用屬性值表現這些特性，比如一個標簽它有長高，那么就用width描述長，height描述高，接受屬性值表現特性，也可以為其加入邊框或者背景顏色，如下
<p width="100px" height="100px" background="red">
這是文本標簽
</p>
說明這個文本標簽在頁面中占有100px的長和100px的高
附：px是像素點單位，網頁中常用的長度單位，除此之外還有cm，rem等
head標簽
head標簽里的內容不會直接顯示在頁面的內容之中的，他主要是用來包裹用于聲明頁面性質和引用外部資源標簽的父標簽
附：父標簽與子標簽
當標簽里面包裹著標簽，我們就叫被包裹的標簽為子標簽，外層包裹的叫父標簽，如
<html> // 父標簽
<head> // 子標簽
這是head
</head>
</html>
head里常見的聲明和外部資源引用標簽
1.meta標簽
meta標簽的作用有：搜索引擎優化（SEO），定義頁面使用語言，自動刷新并指向新的頁面，實現網頁轉換時的動態效果，控制頁面緩沖，網頁定級評價，控制網頁顯示的窗口等！meta可以接受各種屬性值，以確定網頁在瀏覽器中的一些性質，這里我只說一個必不可少的，就是編碼的聲明，這個是確定頁面能否在瀏覽器中解析正確，如果設置了不正確的編碼格式，頁面將會亂碼（關于編碼，可以百度HTML的編碼格式，了解更多）
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
這是主體
</body>
</html>
charset就是設置編碼的格式的屬性，UTF-8是通用的編碼格式，中文編碼格式為GBK
2.title標簽
title標簽是用來設置頁面在瀏覽器標簽欄中的標題的
<html>
<head>
<meta charset="UTF-8">
<title>這是標題</title>
</head>
<body>
這是主體
</body>
</html>
3.引用外部資源的標簽
1.link標簽
引用樣式標簽，這里我不會講解樣式標簽的作用，這將會在css時著重講解
<link rel="stylesheet" href="樣式文件所在目錄的路徑">
2.script標簽
引用腳本文件，這將會在JavaScript中著重講解
<script src="腳本文件所在目錄的路徑"></script>
主體body標簽中的內容
body標簽里的內容將是呈現在頁面中用戶看到的實際內容
圖像img標簽
必備屬性：
src 定義圖像的url
可選屬性：
width 寬
height 高
alt 替代文字（多數情況下用title可替代alt，如果圖片加載失敗，顯示在網頁上的文字）
鏈接a標簽
必備屬性：
href 鏈接的目標路徑
可選屬性：
name 命名。命名后的a稱之為錨點，可以作為鏈接目標
target 指定鏈接在什么樣的窗口中打開
_self 默認。當前窗口
_blank 在新建的窗口中打開鏈接
（title、id、class）
<a href="www.baidu.com" target="_self">這是一個鏈接</a>
錨點鏈接：這是一個特殊的鏈接方式，可跳到本頁面中一個特定位置，這個指向是一個標簽屬性中的命名錨記或是id。
<a href="#name">點擊跳轉</a>
<p id="name">這是要跳轉到地方</p>
郵件鏈接：可以創建一個點擊后發送郵件的鏈接
<a href="mailto:senica@126.com?subject=郵件標題&cc=xxx@126.com&mcc=yyy@126.com">發郵件</a>
Table標簽
table是 HTML里的布局工具，前期可用于簡單布局
<table>
<tr>
<td>編號</td>
<td>姓名</td>
</tr>
<tr>
<td>1</td>
<td>Tom</td>
</tr>
<tr>
<td>1</td>
<td>Lucy</td>
</tr>
</table>
table的組成由外層的table和橫行tr，縱行td組成，
table的屬性 width、height、border、bordercolor、bgcolor
background、cellspacing、cellpadding、align
tr的屬性 height align vlign
td的屬性 width height align vlign colspan rowspan
table的可選標簽：
caption 表格標題
<table>
<caption>這是表格標題</caption>
</table>
thead 表格頭部
<table>
<thead>
<tr>
<td>這是表頭</td>
</tr>
</thead>
</table>
tbody 表格主體
<table>
<thead>
<tr>
<td>這是表頭</td>
</tr>
</thead>
<tbody>
<tr>
<td>這是表的主體</td>
</tr>
</tbody>
</table>
tfoot 表格尾部
<table>
<thead>
<tr>
<td>這是表頭</td>
</tr>
</thead>
<tbody>
<tr>
<td>這是表的主體</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>這是表尾</td>
</tr>
</tfoot>
</table>
文本標簽
文本標簽除了p標簽外，還有span、i、b等標簽
行內元素與塊級元素
在這里，我將著重講解一下行內元素與塊級元素，這將有助于我們更好的理解HTML元素
什么是行內元素和塊級元素？
行內元素，顧名思義，就是多個元素能排在一行，當大于一行的長度，才會擠向下一行，就像一個大盒子，里面可以放小盒子，這個小盒子就是行內元素
塊級元素，自然就是那個大盒子，它是獨占一行的元素，塊級元素可以包裹行內元素，也可以包裹塊級元素，但是行內元素不可以包裹塊級元素
常見的塊級元素：p、div、h1等
常見的行內元素：span、i、b等
一篇文章對于HTML標簽的分享是有限的，更多的標簽使用可以查看w3cSchool的html在線文檔，在線文檔地址
