一、body標籤的屬性

background屬性，給背景設定圖片（預設在水平和垂直方向平鋪） bgcolor屬性，給背景設定顏色

二、文字修飾標籤
加粗<b>內容</b> Bold
斜體<i>內容</i> Italic
下劃線<u>內容</u> Underline
刪除線<s>內容</s> Strikethrough
下標 字<sub>下標</sub> Subscript
上標 字<sup>上標</sup> Superscript

 <font></font>
 

size屬性：1-7
color屬性：設定顏色
face屬性：設定字型，如：楷體

三、排版標籤
段落標籤

段落內容

align：控制段落內容的水平位置
值：left（預設） center right
標題標籤

~

1-6<->大-小
align：控制標題內容的水平位置
值：left center（預設） right
換行標籤

水平線標籤

---

color：水平線的顏色
width：水平線的寬度
值：固定數值或百分比（均以父標籤為參照物）
size：設定水平線的粗細
noshade：去除水平線的陰影，屬性值等於其自身
align：left center（預設） right
預格式化標籤

在此標籤內的空格和換行會保留

四、div與span

：無實際含義，塊級元素，可以設定寬、高，如未設定寬度則為父元素100% ：無意義，行內元素，不能設定寬、高，以文字大小為準

塊級元素：div、h1~h6、p等
行內元素：b、i等

五、字元實體
有些符號會讓html誤認為是標籤如>、<等所以需要使用字元實體

六、圖片標籤
html可以顯示的圖片格式：jpg（jpeg）、png、gif、bmp
不可以顯示的格式：psd、ai
語法：
alt屬性：當圖片不存在則顯示alt中的文字
title屬性：當滑鼠放在圖片上顯示的文字

七、相對路徑與絕對路徑
相對路徑：相對某一資料夾而言
平級關係：可以理解為在同一資料夾下，src輸入./檔名 ./可省略
上級關係：可以理解為圖片與html所在資料夾為平級關係， src輸入…/檔名

絕對路徑：即檔案所在磁碟中的位置

八、超連結
點選跳轉的文字
a -->anchor 錨
href -->hypertext reference 超級連結地址

屬性：
title：滑鼠懸浮文字上顯示的資訊
target：_blank -->在新視窗開啟連結

實現空連結的方式：href="#"
href=“javascript:void(0)”

錨點連結：
①定義錨點：

②找到錨點：

九、無序列表、有序列表、定義列表
無序列表：無先後順序之分

• 表項
• 表項
......

ui -->unordered list li -->list item

必須包含在

中

中可以放任何內容，如圖片超連結等

無序列表前預設為實心圓圈 可在ul或li中新增屬性type
列表可以巢狀

有序列表：有順序之分

1. 表項
2. 表項
......

ol -->ordered list

type屬性可設定數字的方式
start屬性可設定從哪裡開始

定義列表：是一個組標籤，出現三對標籤
dl -->definition list
dt -->definition title
dd -->definition description

......

...... ......

十、表格標籤

...... 表示行 表示列、單元格，內容放在此標籤內 中的內容會加粗居中顯示

屬性：
border：邊框
width：寬度 值可為固定值或百分比
height：高度 一般不用高度由其內容決定
background：設定背景圖片
bgcolor：背景顏色
align：設定表格水平方向的對其，取值：left（預設）、center、right
cellpadding：表格中文字距離邊框的距離
cellspacing：兩個單元格間的距離
valign：設定文字垂直的對其方式， 取值：top、middle（預設）、bottom

合併單元格
colspan：跨列合併
rowspan：跨行合併

十、框架

十一、表單
由和表單控制元件組成

屬性： action：將表單中收集的使用者的資料提交給表單處理程式進行相關處理（一般為php檔案） 可以省略此屬性，預設將表單資料提交給當前頁面進行處理。在本頁面位址列顯示 method：get和post，預設為get get提交的資料會顯示在位址列中，只能提交少量的資料 post提交的資料會直接傳送給表單的處理程式，不會顯示在位址列中，提交相對安 全可提交大量資料 name是控制元件的名稱，而value是控制元件的值 type值： text：單行文字框 password：密碼 radio：單選框， 一組單選按鈕只有其name屬性值設定為一樣才可以實現真正的單選，單選中的checked屬性，表示預設被選中 checkbox：多選框，checked屬性表示預設選擇 submit：提交按鈕，預設的value值為提交 reset：重置按鈕 image：圖片按鈕，src="圖片路徑"，圖片按鈕預設具有提交的功能 file：上傳檔案 button：普通按鈕，需要配合JavaScript使用 hidden：隱藏域，在瀏覽器頁面看不到，但資料可以被提交給後臺處理程式

按鈕名稱
按鈕名稱
按鈕名稱

選項1 選項2 ...... 多選框，屬性selected="selected"表示預設選中

十二、head內的標籤

：顯示網頁的標題 ： 屬性： charset：編碼標準，可以選擇UTF-8等編碼標準，使用正確的標準以防止網頁亂碼 使用記事本編輯即使不寫明編碼標準也不會出現亂碼，因為記事本預設 GBK中文編碼 而使用sublime編輯器時候，其預設編碼為UTF-8，則會出現亂碼

所以使用編輯器進行編輯時，需要表明使用什麼編碼標準

十三、顏色的表示方式
英文單詞表示：如red、yellow等
十進位制：rgb（255.0.0）–>紅、rgb（0.255.0）–>綠、rgb（0.0.255）–>藍等
十六進位制：#FF0000 使用十六進位制相容性更好

以上顏色可在中新增color屬性表示

HTML4 =====> XHTML =====> HTML5

十四、HTML5新增的語義化標籤

頭標籤

十五、H5新增的屬性
required：在表單控制元件中新增required=“required”，則此控制元件為必填項
placeholder：在表單空間中新增placeholder=“內容”，則該文字框內會預設顯示內容，當填
入資訊後，內容消失。
autofocus：游標自動定位到框內。autofocus=“autofocus”

新增的type屬性值：
email：要求使用者必須輸入的是電子郵件

url：限定使用者輸入的內容必須網站要包含http://

date：要求使用者選擇年月日日期
week：要求使用者選擇周型別
time：要求使用者選擇時間（小時、分鐘）
month：要求使用者選擇月份
number：要求使用者輸入的必須時數值型別
color：顏色拾取器
range：範圍

多媒體標籤
插入一個視訊

屬性：
autoplay：autoplay=“autoplay” 新增後會自動播放
controls：controls=“controls” 可以顯示暫停音量等控制元件
loop：loop=“loop” 視訊重複播放
width：寬度
height：高度

解決瀏覽器的相容性問題

意思為，如果不支援第一個則挨個試

插入一個音訊
屬性同視訊

解決瀏覽器相容性問題與解決視訊方式一樣