聲明位于文檔中的最前面的位置，處于 標簽之前。此標簽可告知瀏覽器文檔使用哪種 HTML 或 XHTML 規范。它不是一個html標簽只是一個文檔聲明類型;( 就是告訴瀏覽器按照HTML5 規范解析頁面)
lang="zh-CN“
指定html 語言種類
zh-CN中文的意思，整個文檔的內容以中文為主，如果以英文為主，就寫成lang='en'
="UTF-8"
字符集
字符集( set))是多個字符的集合。以便計算機能夠識別存儲各種文字。 在標簽內，可以通過標簽的 屬性來規定HTML文檔應該使用哪種字符編碼；常用的值有：、BIG5、GBK和UTF-8,其中UTF-8也被稱為萬國碼，基本包含了全世界所有國家需要用到的字符；一般情況下，統一使用UTF-8”編碼，盡量統一寫成標準的"UTF-8",不要寫成"utf-8"或"UTF8"。中文網頁需要使用 聲明編碼，否則會出現亂碼;有些瀏覽器是gbk，需手動設置為
2.1.2 html標簽格式
1.html標簽是由尖括號包圍的關鍵字，如：,
,等;
2.html標簽通常是成對出現，如：,第一個是開始，第二個有斜線的是結束；
3.有些標簽是單獨呈現的，如：、
、
;
4.標簽里面帶有若干屬性，也有不帶的；
2.1.3 HTML標簽的語義化
白話： 所謂標簽語義化，就是指標簽的含義。
pink老師 一句話說出語義化目的:
根據標簽的語義，在合適的地方給一個最為合理的標簽，讓結構更清晰。
方便代碼的閱讀和維護同時讓瀏覽器或是網絡爬蟲可以很好地解析，從而更好分析其中的內容使用語義化標簽會具有更好地搜索引擎優化
語義是否良好： 當我們去掉CSS之后，網頁結構依然組織有序，并且有良好的可讀性。( 裸奔起來一樣好看 )
遵循的原則：先確定語義的HTML ，再選合適的CSS。所以，我們接下來學習html標簽，要根據語義去記憶。 HTML網頁中任何元素的實現都要依靠HTML標簽。
3.HTML常用標簽
首先 HTML和CSS是兩種完全不同的語言，我們學的是結構，就只寫HTML標簽，認識標簽就可以了。 不會再給結構標簽指定樣式了。
HTML標簽有很多，這里我們學習最為常用的，后面有些較少用的，我們可以查下手冊就可以了。
3.1排版標簽
排版標簽主要和css搭配使用，顯示網頁結構的標簽，是網頁布局最常用的標簽。
3.1.1標題標簽h (熟記)
單詞縮寫： head 頭部. 標題title 文檔標題
為了使網頁更具有語義化，我們經常會在頁面中用到標題標簽，HTML提供了6個等級的標題，即
標題標簽語義： 作為標題使用，并且依據重要性遞減
其基本語法格式如下：
標題文本
標題文本
標題文本
標題文本
標題文本
標題文本
顯示效果如下：
小結 :
3.1.2段落標簽p ( 熟記)
單詞縮寫： 段落 [?p?r?gr?f] 無須記這個單詞
作用語義：
可以把 HTML 文檔分割為若干段落
在網頁中要把文字有條理地顯示出來，離不開段落標簽，就如同我們平常寫文章一樣，整個網頁也可以分為若干個段落html a標簽內文字居中，而段落的標簽就是
文本內容
是HTML文檔中最常見的標簽，默認情況下，文本在一個段落中會根據瀏覽器窗口的大小自動換行。
3.1.3水平線標簽hr(認識)
單詞縮寫： 橫線 [?h?r??zɑntl] 同上
在網頁中常常看到一些水平線將段落與段落之間隔開，使得文檔結構清晰，層次分明。這些水平線可以通過插入圖片實現，也可以簡單地通過標簽來完成，
就是創建橫跨網頁水平線的標簽。其基本語法格式如下：
是單標簽
在網頁中顯示默認樣式的水平線。(基本不用，開發中使用樣式-)
3.1.4換行標簽br (熟記)
單詞縮寫： break 打斷 ,換行
在HTML中，一個段落中的文字會從左到右依次排列，直到瀏覽器窗口的右端，然后自動換行。如果希望某段文本強制換行顯示，就需要使用換行標簽
這時如果還像在word中直接敲回車鍵換行就不起作用了。
3.1.5div 和 span標簽(重點)
div span 是沒有語義的是我們網頁布局主要的2個盒子 想必你聽過 css+div
div 就是 的縮寫 分割， 分區的意思 其實有很多div 來組合網頁。
span 跨度，跨距；范圍
語法格式：
這是頭部 今日價格
他們兩個都是盒子，用來裝我們網頁元素的， 只不過他們有區別，現在我們主要記住使用方法和特點就好了
后面后面講顯示模式的時候，會告訴大家
排版標簽總結標簽名定義說明
標題標簽
作為標題使用，并且依據重要性遞減
段落標簽
可以把 HTML 文檔分割為若干段落
水平線標簽
沒啥可說的，就是一條線
換行標簽
div標簽
用來布局的，但是現在一行只能放一個div
span標簽
用來布局的，一行上可以放好多個span
3.2文本格式化標簽(熟記)
在網頁中，有時需要為文字設置粗體、斜體或下劃線效果，這時就需要用到HTML中的文本格式化標簽，使文字以特殊的方式顯示。
區別：
b 只是加粗 除了可以加粗還有 強調的意思， 語義更強烈。
剩下的同理...
請同學們重點記住 前兩組 加粗 和 傾斜 后面兩組沒記住回來查
3.3標簽屬性
所謂屬性就是外在特性 比如 手機的顏色 手機的尺寸 ，總結就是手機的。。
使用HTML制作網頁時，如果想讓HTML標簽提供更多的信息，可以使用HTML標簽的屬性加以設置。其基本語法格式如下：
<標簽名 屬性1="屬性值1" 屬性2="屬性值2" …> 內容
<手機 顏色="紅色" 大小="5寸">
3.4 注釋標簽
在HTML中還有一種特殊的標簽——注釋標簽。如果需要在HTML文檔中添加一些便于閱讀和理解但又不需要顯示在頁面中的注釋文字，就需要使用注釋標簽。
簡單解釋：
注釋內容不會顯示在瀏覽器窗口中，但是作為HTML文檔內容的一部分，也會被下載到用戶的計算機上，查看源代碼時就可以看到。
語法格式：
快捷鍵是： ctrl + / 或者 ctrl +shift + /
注釋重要性：
pink老師 一句話說出他們:
注釋是給人看的，目的是為了更好的解釋這部分代碼是干啥的， 程序是不執行這個代碼的
3.4.1團隊約定
一般用于簡單的描述，如某些狀態描述、屬性描述等
注釋內容前后各一個空格字符，注釋位于要注釋代碼的上面，單獨占一行
推薦：
...
不推薦：
...
...
3.5預格式化文本pre標簽
標簽可定義預格式化的文本。 被包圍在標簽 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。 ```html此例演示如何使用 pre 標簽 對空行和 空格 進行控制**pink老師 一句話說出他們:** > 所謂的預格式化文本就是 ，按照我們預先寫好的文字格式來顯示頁面， 保留空格和換行等。 有了這個標簽，里面的文字，會按照我們書寫的模式顯示，不需要段落和換行標簽了。但是，比較少用，因為不好整體控制。 ## 3.6特殊字符 （理解） 一些特殊的符號，我們再html 里面很難或者 不方便直接 使用， 我們此時可以使用下面的替代代碼。 **雖然有很多，但是我們平時用的比較較少， 大家重點記住 空格 大于號 小于號 就可以了，剩下的回來查閱。** **總結：** 1. 是以**運算符**`&`開頭,以**分號運算符**`;`結尾。 2. 他們不是標簽，而是符號。 3. HTML 中不能使用小于號 “<” 和大于號 “>”特殊字符，瀏覽器會將它們作為標簽解析，若要正確顯示，在 HTML 源代碼中使用字符實體 #### 3.6.1團隊約定 *推薦：*more >>
*不推薦：*more >>
## 3.7 html5發展之路 ## 3.8 什么是XHTML XHTML 是更嚴格更純凈的 HTML 代碼。 - XHTML 指**可擴展超文本標簽語言**（EXtensible HyperText Markup Language）。 - XHTML 的目標是取代 HTML。 - XHTML 與 HTML 4.01 幾乎是相同的。 - XHTML 是更嚴格更純凈的 HTML 版本。 - XHTML 是作為一種 XML 應用被重新定義的 HTML。 - XHTML 是一個 W3C 標準。 #### 5.7 HTML和 XHTML之間有什么區別? - XHTML 指的是可擴展超文本標記語言 - XHTML 與 HTML 4.01 幾乎是相同的 - XHTML 是更嚴格更純凈的 HTML 版本 - XHTML 是以 XML 應用的方式定義的 HTML - XHTML 是 2001 年 1 月發布的 W3C 推薦標準 - XHTML 得到所有主流瀏覽器的支持 - XHTML 元素是以 XML 格式編寫的 HTML 元素。XHTML是嚴格版本的HTML，例如它要求標簽必須小寫，標簽必須被正確關閉，標簽順序必須正確排列，對于屬性都必須使用雙引號等。 # 4.圖像 ## 4.1圖像標簽img (重點) 單詞縮寫： image 圖像 要想在網頁中顯示圖像就需要使用圖像標簽，接下來將詳細介紹圖像標簽以及和他相關的屬性。（它是一個單身狗） 語法如下： ```html該語法中src屬性用于指定圖像文件的路徑和文件名，他是img標簽的必需屬性。
后面我們會用css來做，這里童鞋們就記住這個 單詞就好了
**注意: **
標簽可以擁有多個屬性，必須寫在開始標簽中，位于標簽名后面。屬性之間不分先后順序，標簽名與屬性、屬性與屬性之間均以空格分開。采取 鍵值對 的格式 key="value" 的格式
比如:
正常的
帶有邊框的
有提示文本的
有替換文本的
重點掌握點：
5. 路徑(重點、難點)
實際工作中，我們的文件不能隨便亂放，否則用起來很難快速的找到他們，因此我們需要一個文件夾來管理他們。
**目錄文件夾： **
就是普通文件夾，里面只不過存放了我們做頁面所需要的 相關素材，比如 html文件， 圖片 等等。
**根目錄 **
打開目錄文件夾的第一層 就是 根目錄
頁面中的圖片會非常多， 通常我們再新建一個文件夾專門用于存放圖像文件（），這時再插入圖像，就需要采用“路徑”的方式來指定圖像文件的位置。路徑可以分為： 相對路徑和絕對路徑
5.1相對路徑
以引用文件之網頁所在位置為參考基礎，而建立出的目錄路徑。因此，當保存于不同目錄的網頁引用同一個文件時，所使用的路徑將不相同，故稱之為相對路徑。
路徑分類符號說明
同一級路徑
只需輸入圖像文件的名稱即可，如
。
下一級路徑
“/”
圖像文件位于HTML文件同級文件夾下（例如文件夾名稱為：）如
。
上一級路徑
“../”
在文件名之前加入“../”html a標簽內文字居中，如果是上兩級，則需要使用 “../ ../”，以此類推，如
。
**pink老師 一句話說出他們: **
相對路徑，是從代碼所在的這個文件出發， 去尋找我們的目標文件的，而 我們所說的 上一級 下一級 同一級 簡單說，就是 圖片 位于 HTML 頁面的位置
5.2絕對路徑
絕對路徑以Web站點根目錄為參考基礎的目錄路徑。之所以稱為絕對，意指當所有網頁引用同一個文件時，所使用的路徑都是一樣的。
“D:.gif”，或完整的網絡地址，例如“”。
注意：
絕對路徑用的較少，我們理解下就可以了。 但是要注意，它的寫法 特別是符號 并不是 相對路徑的 /
6.鏈接標簽(錨點)6.1 鏈接標簽(重點)
單詞縮寫： 的縮寫 [???k?(r)] 。基本解釋 錨, 鐵錨 的
在HTML中創建超鏈接非常簡單，只需用標簽把文字包括起來就好。
語法格式：
文本或圖像屬性作用
href（必須屬性）
用于指定鏈接目標的url地址，當為標簽應用href屬性時，它就具有了超鏈接的功能
用于指定鏈接頁面的打開方式，其取值有_self和兩種，其中_self為默認值，為在新窗口中打開方式。
6.2常用鏈接外部鏈接:單擊該超鏈接連接到其他網站上的某一個頁面
百度內部鏈接:單擊該超鏈接連接到同一網站的另外一個頁面,直接鏈接內部頁面名稱即可
< a href=" index.html">首頁錨點鏈接:我們點擊鏈接，可以快速定位到頁面中的某個位置在鏈接文本的href屬性中
首頁
首頁
新聞
新聞
產品
產品
關于我們
關于我們
6.3其他鏈接
使用對象的不同，網頁中的鏈接可以分為:
空鏈接:如果當時沒有確定鏈接目標時,設置為空鏈接
< a href="#">首頁下載鏈接:如果href里面地址是一個文件或者壓縮包，會下載這個文件,
下載網頁元素鏈接: 在網頁中的各種網頁元素，如文本、圖像、表格、音頻、視頻等都可以添加超鏈接
重點掌握點：
6.4 base 標簽
語法：
**總結： **
base 可以設置整體鏈接的打開狀態base 寫到 之間把所有的連接 都默認添加 =""
pink老師 一句話說出他們:
全體鏈接~ 到 ~ 全體集合 所有鏈接 以新窗口打開頁面 ~ 是
7.表格table(會使用)
為了讓我們頁面顯示的更加整齊，我們需要學習三個表（表格、表單、列表）
目標：
應用：
表格作用：
存在即是合理的。 表格的現在還是較為常用的一種標簽，但不是用來布局，常見顯示、展示表格式數據。
因為它可以讓數據顯示的非常的規整，可讀性非常好。
特別是后臺展示數據的時候表格運用是否熟練就顯得很重要，一個清爽簡約的表格能夠把繁雜的數據表現得很有條理，雖然 div 布局也可以做到，但是總沒有表格來得方便。
ps: 這些地方用表格，你會覺得生活還是那么美好。。。。忍不住想說 PPAP i hava a pen
7.1.創建表格
在HTML網頁中，要想創建表格，就需要使用表格相關的標簽。
創建表格的基本語法：
... 單元格內的文字 ...要深刻體會表格、行、單元格他們的構成。
在上面的語法中包含基本的三對HTML標簽，分別為 table、tr、td，他們是創建表格的基本標簽，缺一不可，下面對他們進行具體地解釋
table用于定義一個表格標簽。
tr標簽 用于定義表格中的行，必須嵌套在 table標簽中。
td 用于定義表格中的單元格，必須嵌套在標簽中。
字母 td 指表格數據（table data），即數據單元格的內容，現在我們明白，表格最合適的地方就是用來存儲數據的。
**總結： **
7.2.表格屬性
表格有部分屬性我們不常用，這里重點記住 、 。
我們經常有個說法，是三參為0， 平時開發的我們這三個參數 為 0
案例1：
姓名 性別 年齡 劉德華 男 55 郭富城 男 52 張學友 男 58 黎明 男 18 劉曉慶 女 63 7.3表頭單元格標簽th語法：
案例2：
?效果圖
?代碼：
姓名 性別 電話 小王 女 110 小明 男 120 pink老師 一句話說出他們:
th 也是一個單元格 只不過和普通的 td單元格不一樣，它會讓自己里面的文字居中且加粗
7.4 表格標題
定義和用法
我是表格標題 **注意： **
元素定義表格標題，通常這個標題會被居中且顯示于表格之上。 標簽必須緊隨 table 標簽之后。這個標簽只存在 表格里面才有意義。你是風兒我是沙7.5合并單元格(難點)
合并單元格是我們比較常用的一個操作，但是不會合并的很復雜。
7.5.1 合并單元格2種方式
1. 目標單元格：（寫合并代碼)2.合并單元格三步曲先確定是跨行還是跨列合并。找到目標單元格。寫上合并方式=合并的單元格數量。比如：< td ="2">刪除多余的單元格。7.6. 總結表格標簽名定義說明
表格標簽
就是一個四方的盒子
表格行標簽
行標簽要再table標簽內部才有意義
單元格標簽
單元格標簽是個容器級元素，可以放任何東西
表頭單元格標簽
它還是一個單元格，但是里面的文字會居中且加粗
表格標題標簽
表格的標題，跟著表格一起走，和表格居中對齊
和
合并屬性
用來合并單元格的
表格提供了HTML 中定義表格式數據的方法。表格中由行中的單元格組成。表格中沒有列元素，列的個數取決于行的單元格個數。表格不要糾結于外觀，那是CSS 的作用。表格的學習要求： 能手寫表格結構，并且能簡單合并單元格。7.6.1表格劃分結構（了解）
對于比較復雜的表格，表格的結構也就相對的復雜了，所以又將表格分割成三個部分：題頭、正文和腳注。而這三部分分別用:thead,tbody,tfoot來標注， 這樣更好的分清表格結構注意：
內部必須擁有 標簽！標簽描述
用于定義表格的頭部。用來放標題之類的東西。
用于定義表格的主體。放數據本體 。
放表格的腳注之類。
定義用于表格列的屬性
定義表格列的組
以上標簽都是放到table標簽
8.列表應用
問？
前面我們知道表格一般用于數據展示的，但是網頁中還是有很多跟表格類似的布局，如下圖~~ 我們用什么做呢？
答：
答案是列表， 那什么是列表？ 表格是用來顯示數據的，那么列表就是用來布局的。 因為非常整齊和自由
8.1 無序列表 ul （重點）
現實中的表單，類似我們去銀行辦理信用卡填寫的單子。 如下圖
**作用： **
表單目的是為了收集用戶信息。
在我們網頁中， 我們也需要跟用戶進行交互，收集用戶資料，此時也需要表單。
在HTML中，一個完整的表單通常由表單控件（也稱為表單元素）、提示信息和表單域3個部分構成。
**表單控件： **
?包含了具體的表單功能項，如單行文本輸入框、密碼輸入框、復選框、提交按鈕、重置按鈕等。
提示信息：
?一個表單中通常還需要包含一些說明性的文字，提示用戶進行填寫和操作。
表單域：
?他相當于一個容器，用來容納所有的表單控件和提示信息，可以通過他定義處理表單數據所用程序的url地址，以及數據提交到服務器的方法。如果不定義表單域，表單中的數據就無法傳送到后臺服務器。
9.1form表單域
**語法: **
常用屬性：
屬性屬性值作用
url地址
用于指定接收并處理表單數據的服務器程序的url地址。
get/post
用于設置表單數據的提交方式，其取值為get或post。
name
名稱
用于指定表單的名稱，以區分同一個頁面中的多個表單。
注意:
每個表單都應該有自己表單域。我們現在做頁面，不寫看不到效果，但是 如果后面學 ajax 后臺交互的時候，必須需要 form表單域。
9.2 input 控件(重點)
常用屬性：
1. type 屬性
用戶名: 密 碼：2. value屬性 值
用戶名:3. name屬性
用戶名:name表單的名字， 這樣，后臺可以通過這個name屬性找到這個表單。 頁面中的表單很多，name主要作用就是用于區別不同的表單。
男 女4. 屬性
性 別: 男 女上面這個，表示就默認選中了 男 這個單選按鈕
5. input 屬性小結屬性說明作用
type
表單類型
用來指定不同的控件類型
value
表單值
表單里面默認顯示的文本
name
表單名字
頁面中的表單很多，name主要作用就是用于區別不同的表單。
默認選中
表示那個單選或者復選按鈕一開始就被選中了
注意
radio和必須設置name屬性，并且所有的radio或者的name屬性要保持一致。如果使用默認值，添加標簽=""。9.3 label標簽(理解)
目標：
label標簽主要目的是為了提高用戶體驗。 為用戶提高最優秀的服務。
概念：
label 標簽為 input 元素定義標注（標簽）。
作用：
用于綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點。
如何綁定元素呢？
第一種用法就是用label直接包括input表單。
適合單個表單選擇
第二種用法 for 屬性規定 label 與哪個表單元素(id)綁定。
pink老師 一句話說出他們:
當我們鼠標點擊 label標簽里面的文字時， 光標會定位到指定的表單里面
9.4 控件(文本域)
文本框和文本域區別表單名稱區別默認值顯示用于場景
input type="text"
文本框
只能顯示一行文本
單標簽，通過value顯示默認值
用戶名、昵稱、密碼等
文本域
可以顯示多行文本
雙標簽，默認值寫到標簽中間
留言板
9.5 下拉列表
目的：
如果有多個選項讓用戶選擇，為了節約空間，我們可以使用控件定義下拉列表.
語法：
程序員燈塔
