1、HTML基礎(chǔ)簡介HTML簡介超文本標(biāo)記語言英文全稱(HyperText Markup Language)，標(biāo)準(zhǔn)通用標(biāo)記語言下的一個(gè)應(yīng)用?！俺谋尽本褪侵疙撁鎯?nèi)可以包含圖片、鏈接，甚至音樂、程序等非文字元素。超文本標(biāo)記語言的結(jié)構(gòu)包括“頭”部分（英語：Head）、和“主體”部分（英語：Body），其中“頭”部提供關(guān)于網(wǎng)頁的信息，“主體”部分提供網(wǎng)頁的具體內(nèi)容。HTML語言特點(diǎn)簡易性：超級文本標(biāo)記語言版本升級采用超集方式，從而更加靈活方便?？蓴U(kuò)展性：超級文本標(biāo)記語言的廣泛應(yīng)用帶來了加強(qiáng)功能，增加標(biāo)識符等要求，超級文本標(biāo)記語言采取子類元素的方式，為系統(tǒng)擴(kuò)展帶來保證。平臺無關(guān)性：雖然個(gè)人計(jì)算機(jī)大行其道，

2、但使用MAC等其他機(jī)器的大有人在，超級文本標(biāo)記語言可以使用在廣泛的平臺上，這也是萬維網(wǎng)（WWW）盛行的另一個(gè)原因。通用性：另外，HTML是網(wǎng)絡(luò)的通用語言,一種簡單、通用的全置標(biāo)記語言。HTML發(fā)展史HTML 2.01995年11月作為RFC 1866發(fā)布，在RFC 2854于2000年6月發(fā)布之后被宣布已經(jīng)過時(shí)HTML 3.21997年1月14日，W3C推薦標(biāo)準(zhǔn)HTML 4.01997年12月18日，W3C推薦標(biāo)準(zhǔn)HTML 4.01（微小改進(jìn)）1999年12月24日，W3C推薦標(biāo)準(zhǔn)HTML 52014年10月28日，W3C推薦標(biāo)準(zhǔn)HTML標(biāo)題HTML 標(biāo)題HTML 標(biāo)題（Heading）是通過

3、 - 標(biāo)簽來定義的。一共分為六級標(biāo)題主要是放在之間這是一個(gè)標(biāo)題這是一個(gè)標(biāo)題這是一個(gè)標(biāo)題HTML元素HTML 文檔由 HTML 元素定義。HTML Element 以開始標(biāo)簽起始,以結(jié)束標(biāo)簽終止。元素的內(nèi)容是開始標(biāo)簽與結(jié)束標(biāo)簽之間的內(nèi)容。大多數(shù) HTML 元素可擁有屬性。例如：、 等開始標(biāo)記內(nèi)容結(jié)束標(biāo)記這是一個(gè)段落標(biāo)記這是一個(gè)超鏈接這是一個(gè)div布局HTML段落HTML 可以將文檔分割為若干段落段落是通過 標(biāo)簽定義的。This is a paragraph This is another paragraph如果您希望在不產(chǎn)生一個(gè)新段落的情況下進(jìn)行換行（新行），請使用 標(biāo)簽This isa par

4、agraph with line breaksHTML文本格式化HTML 格式化標(biāo)簽HTML 使用標(biāo)簽 與 對輸出的文本進(jìn)行格式, 如：粗體 or 斜體標(biāo)簽定義描述描述 定義粗體文本定義著重文字 定義斜體字定義小號字HTML文本格式化定義加重語氣 定義下標(biāo)字 定義上標(biāo)字定義插入字定義刪除字HTML超鏈接HTML 使用超級鏈接與網(wǎng)絡(luò)上的另一個(gè)文檔相連。幾乎可以在所有的網(wǎng)頁中找到鏈接。點(diǎn)擊鏈接可以從一張頁面跳轉(zhuǎn)到另一張頁面。HTML使用標(biāo)簽 來設(shè)置超文本鏈接。超鏈接可以是一個(gè)字，一個(gè)詞，或者一組詞，也可以是一幅圖像等。默認(rèn)情況下，鏈接將以以下形式出現(xiàn)在瀏覽器中：一個(gè)未訪問過的鏈接顯示為藍(lán)色字體并帶

5、有下劃線訪問過的鏈接顯示為紫色并帶上下劃線點(diǎn)擊鏈接時(shí)，鏈接顯示為紅色并帶上下劃線HTML超鏈接鏈接的 HTML 代碼很簡單。它類似這樣：鏈接文本HTML 鏈接 - target 屬性使用 target 屬性，你可以定義被鏈接的文檔在何處顯示。訪問我的網(wǎng)站!HTML Head屬性HTML 元素 元素包含了所有的頭部標(biāo)簽元素。在 元素中你可以插入腳本（scripts）, 樣式文件（CSS），及各種meta信息?？梢蕴砑釉陬^部區(qū)域的元素標(biāo)簽為: , , , , , , and .HTML 元素 標(biāo)簽定義了不同文檔的標(biāo)題。 在 HTML/XHTML 文檔中是必須的。 元素:定義了瀏覽器工具欄的標(biāo)題當(dāng)網(wǎng)

6、頁添加到收藏夾時(shí)，顯示在收藏夾中的標(biāo)題顯示在搜索引擎結(jié)果頁面的標(biāo)題HTML 元素 標(biāo)簽定義了文檔與外部資源之間的關(guān)系。 標(biāo)簽通常用于鏈接到樣式表:例如：HTML 元素 標(biāo)簽定義了HTML文檔的樣式文件引用地址.在 元素中你需要指定樣式文件來渲染HTML文檔。body background-color:yellowp color:blueHTML元素meta標(biāo)簽描述了一些基本的元數(shù)據(jù)。 標(biāo)簽提供了元數(shù)據(jù).元數(shù)據(jù)也不顯示在頁面上，但會(huì)被瀏覽器解析。META元素通常用于指定網(wǎng)頁的描述，關(guān)鍵詞，文件的最后修改時(shí)間，作者，和其他元數(shù)據(jù)。元數(shù)據(jù)可以使用于瀏覽器（如何顯示內(nèi)容或重新加載頁面），搜索引擎（關(guān)鍵

7、詞），或其他Web服務(wù)。一般放置于 區(qū)域HTML元素為搜索引擎定義關(guān)鍵詞:每30秒中刷新當(dāng)前頁面:HTML元素標(biāo)簽用于加載腳本文件，如： JavaScript。 元素在以下章節(jié)會(huì)詳細(xì)描述。導(dǎo)入js文件HTML CSS 樣式CSS 是在 HTML 4 開始使用的,是為了更好的渲染HTML元素而引入的.CSS 可以通過以下方式添加到HTML中:內(nèi)聯(lián)樣式- 在HTML元素中使用style 屬性內(nèi)部樣式表 -在HTML文檔頭部 區(qū)域使用 元素 來包含CSS外部引用 - 使用外部 CSS 文件HTML CSS 樣式內(nèi)聯(lián)樣式This is a paragraph.This is a headingThis

8、 is a paragraph.字體, 字體顏色 ，字體大小HTML CSS 樣式內(nèi)部樣式表當(dāng)單個(gè)文件需要特別樣式時(shí)，就可以使用內(nèi)部樣式表。你可以在 部分通過 標(biāo)簽定義內(nèi)部樣式表:body background-color:yellow;p color:blue;HTML CSS 樣式外部樣式表當(dāng)樣式需要被應(yīng)用到很多頁面的時(shí)候，外部樣式表將是理想的選擇。使用外部樣式表，你就可以通過更改一個(gè)文件來改變整個(gè)站點(diǎn)的外觀。HTML 圖像在 HTML 中，圖像由 標(biāo)簽定義。 是空標(biāo)簽，意思是說，它只包含屬性，并且沒有閉合標(biāo)簽。alt屬性設(shè)置圖像的高度與寬度HTML 表格HTML 表格表格由 標(biāo)簽來定義。

9、每個(gè)表格均有若干行（由 標(biāo)簽定義），每行被分割為若干單元格（由 標(biāo)簽定義）。字母 td 指表格數(shù)據(jù)（table data）。HTML 表格和邊框?qū)傩允褂眠吙驅(qū)傩詠盹@示一個(gè)帶有邊框的表格：HTML 表格HTML 表格表頭表格的表頭使用 標(biāo)簽進(jìn)行定義。Header 1Header 2HTML 表格單元格邊距(Cell padding)單元格間距(Cell spacing)表格 標(biāo)簽 Monthly savingsHTML 列表HTML 支持有序、無序和定義列表:HTML無序列表無序列表是一個(gè)項(xiàng)目的列表，此列項(xiàng)目使用粗體圓點(diǎn)（典型的小黑圓圈）進(jìn)行標(biāo)記。CoffeeMilkHTML 列表HTML 有序

10、列表同樣，有序列表也是一列項(xiàng)目，列表項(xiàng)目使用數(shù)字進(jìn)行標(biāo)記。 有序列表始于 標(biāo)簽。每個(gè)列表項(xiàng)始于 標(biāo)簽。列表項(xiàng)項(xiàng)使用數(shù)字來標(biāo)記。CoffeeMilkHTML 列表HTML 自定義列表自定義列表不僅僅是一列項(xiàng)目，而是項(xiàng)目及其注釋的組合。自定義列表以 標(biāo)簽開始。每個(gè)自定義列表項(xiàng)以 開始。每個(gè)自定義列表項(xiàng)的定義以 開始。Coffee- black hot drinkMilk- white cold drinkHTML標(biāo)題HTML 標(biāo)題HTML 標(biāo)題（Heading）是通過 - 標(biāo)簽來定義的。一共分為六級標(biāo)題主要是放在之間這是一個(gè)標(biāo)題這是一個(gè)標(biāo)題這是一個(gè)標(biāo)題HTML 布局網(wǎng)頁布局對改善網(wǎng)站的外觀非常重要

11、。大部分網(wǎng)頁主要是使用div作為布局設(shè)計(jì)網(wǎng)頁HTML 布局 - 使用 元素div 元素是用于分組 HTML 元素的塊級元素展示案例HTML 表單元素HTML 表單表單是一個(gè)包含表單元素的區(qū)域。表單元素是允許用戶在表單中輸入內(nèi)容,比如：文本域(textarea)、下拉列表、單選框(radio-buttons)、復(fù)選框(checkboxes)等等。表單使用表單標(biāo)簽 來設(shè)置:HTML 表單元素HTML 表單 - 輸入元素多數(shù)情況下被用到的表單標(biāo)簽是輸入標(biāo)簽（）。輸入類型是由類型屬性（type）定義的。大多數(shù)經(jīng)常被用到的輸入類型如下文本域（Text Fields）密碼字段密碼字段通過標(biāo)簽 來定義:HT

12、ML表單元素單選按鈕（Radio Buttons）復(fù)選框（Checkboxes）提交按鈕(Submit Button) 定義了下拉選項(xiàng)列表 指定一個(gè)預(yù)先定義的輸入控件選項(xiàng)列表 HTML 顏色HTML 顏色由紅色、綠色、藍(lán)色混合而成。HTML 顏色由一個(gè)十六進(jìn)制符號來定義，這個(gè)符號由紅色、綠色和藍(lán)色的值組成（RGB）。種顏色的最小值是0（十六進(jìn)制：#00）。最大值是255（十六進(jìn)制：#FF）。HTML5 介紹什么是 HTML5?HTML5 是下一代 HTML 標(biāo)準(zhǔn)。HTML , HTML 4.01的上一個(gè)版本誕生于 1999 年。自從那以后，Web 世界已經(jīng)經(jīng)歷了巨變。HTML5 仍處于完善之中

13、。然而，大部分現(xiàn)代瀏覽器已經(jīng)具備了某些 HTML5 支持。HTML 介紹HTML5 中的一些有趣的新特性：用于繪畫的 canvas 元素用于媒介回放的 video 和 audio 元素對本地離線存儲(chǔ)的更好的支持新的特殊內(nèi)容元素，比如 article、footer、header、nav、section新的表單控件，比如 calendar、date、time、email、url、searchHTML 介紹HTML5 聲明必須位于 HTML5 文檔中的第一行,使用非常簡單:HTML 改進(jìn)HTML5 的改進(jìn)新元素新屬性、完全支持 CSS3、Video 和 Audio2D/3D 制圖、本地存儲(chǔ)本地 SQ

14、L 數(shù)據(jù)Web 應(yīng)用HTML Input類型Input 類型: colorcolor 類型用在input字段主要用于選取顏色I(xiàn)nput 類型: datedate 類型允許你從一個(gè)日期選擇器選擇一個(gè)日期生日: HTML Input類型Input 類型: datetimedatetime 類型允許你選擇一個(gè)日期（UTC 時(shí)間）。Input 類型: datetime-localdatetime-local 類型允許你選擇一個(gè)日期和時(shí)間 (無時(shí)區(qū))。HTML Input類型Input 類型: emailemail 類型用于應(yīng)該包含 e-mail 地址的輸入域。在提交表單時(shí)，會(huì)自動(dòng)驗(yàn)證 email 域的

15、值是否合法有效:E-mail: Input 類型: monthmonth 類型允許你選擇一個(gè)月份。HTML Input元素Input 類型: numbernumber 類型用于應(yīng)該包含數(shù)值的輸入域。使用下面的屬性來規(guī)定對數(shù)字類型的限定：max- 規(guī)定允許的最大值min - 規(guī)定允許的最小值step - 規(guī)定合法的數(shù)字間隔（如果 step=3，則合法的數(shù)是 -3,0,3,6 等）value - 規(guī)定默認(rèn)值HTML Input元素Input 類型: rangerange 類型用于應(yīng)該包含一定范圍內(nèi)數(shù)字值的輸入域。range 類型顯示為滑動(dòng)條。請使用下面的屬性來規(guī)定對數(shù)字類型的限定：max - 規(guī)定允許的最大值min - 規(guī)定允許的最