HTML的总结
HTML
HTML：（Hype Text?Markup Language）超文本標記語言，是最基本的網頁語言。代碼由標簽組成，不區分大小寫。
由<html>開始，</html>結束，分頭部分（head）和體部分（body），頭部分用于給頁面增加一些輔助或屬性信息，最先加載。體部分是真正存放頁面數據的地方。
屬性和屬性值用“=”連接，屬性值可加雙引號、單引號或不加引號。
標簽相當于一個容器，數據存放在容器里，對數據操作，就是在修改容器的屬性值。
?
字體標簽：<font size=”5”?color=”red”>文字</font>
color屬性可用顏色單詞，也可用“#FFFFFF”：井號加十六進制數據表示，紅綠藍
?
標題標簽：<h1>文字</h1> ?共有6級標題 ?
?
水平線標簽：<hr color=”red”?size=”5”/>size屬性指定水平線粗細
?
特殊符號：
大于號＞ | 小于號＜ | 與符號& | 雙引號” | 空格 | 注冊符 | 版權符 | TM符 |
< | > | & | " |
?
列表和項目符號標簽：
定義列表<dl> </dl> | 數字標簽<ol> </ol> | 符號標簽<ul> </ul> | |
<dl>定義列表DefinedList <dt>定義項目 ????<dd>具體項目</dd> ????<dd>具體項目</dd> </dt> </dl> 自動縮進效果 | 具體項目內容用<li></li>封裝 ?自動縮進 | ||
默認數字樣式 ?可用type修改：a ?A ?I??i ?1 Start屬性指定起始號碼 | 默認樣式空心圓circle ? disc實心圓 ?square黑方塊 可用CSS自定義符號 | ||
?
注釋標簽：<!—注釋內容-->
?
圖像標簽：<img src=”../dir/file”?alt=”說明文字”?height ?width ?border/>
src屬性中可用兩個點（../）代表上層目錄
alt屬性中的說明文字在鼠標懸停和圖片加載失敗時顯示
圖像地圖：用<img>封裝好圖像后，切換到DW設計視圖，在屬性中選擇熱點區域形狀并在圖像上拖動出一塊熱點區域，用熱點區域鏈接某個資源。在頁面中點擊熱點區域就會跳轉到相應資源。
?
表格標簽：<table><tr><td></td></tr></table>
<table border=”邊框粗細”?bordercolor ?cellpadding=”單元格中數據與單元格邊框間距”?cellspacing=”單元格與單元格間距 0兩線并為一線”?width=’固定像素值或相對頁面百分比’>cellspacing=0兩線并成一線但顯示出來粗，用CSS中border-collapse兩線重疊看起來就是一條線
<table>標簽內<caption></caption>給表格加標題，是表格的一部分
?
<td colspan=2>行占兩列 | |
<td rowspan=2>列占兩行 第一行第一個單元格 | 第一行第二個 |
第二行只有一個 |
?
table標簽中默認都有一個tbody標簽 ???thead、tbody、tfoot
瀏覽頁面時，瀏覽器解析由table標簽封裝的頁面數據時，讀到</table>表格結束標記才會顯示數據，若封裝頁面數據的表格很大，沒讀到結束標記就不顯示任何數據，用戶體驗不佳，所以將表格分為多個部分，讀一個</tbody>就顯示一部分。用tbody將表格分體
?
超鏈接標簽：<a href=”http://www.xxx.cn”?>文字</a>
點擊一個超鏈接做了什么？首先啟動相應的協議解析引擎，訪問本機hosts文件，查找對應主機IP，未找到再請求網絡DNS服務器獲取對應IP，用IP訪問指定主機。
href屬性，可以指定協議，mailto:abc@qq.com?subject=”郵件主題”&cc=”抄送地址”
mailtothunder…… ??不指定協議默認啟動文件協議解析
href=www.baidu.com默認使用file協議打開的是一個本地文件 并不是主機地址
超鏈接實現頁面內跳轉：定位標記、錨
<a name=”top”>頂部位置</a> ?
用a標簽的name屬性為當前位置指定一個名字，不使用href屬性
…很多頁面內容… ?
在適當位置用a標簽鏈接到指定名字的位置 ?用#標示當前頁面
<a href=”#top”>回到頂部位置</a>
target屬性指定頁面打開方式，默認在當前頁面內打開，_blank新窗口打開
title屬性：當鼠標懸停在文字上時顯示的文字內容
?
?
表單標簽：用于與服務端交互
?
<form action=”表單提交目的地”?method=”表單提交方式”></form>
form標簽內的組件：input接收用戶輸入數據 select下拉列表 textarea文本區域
?
<input type=”text”?name=”user”?value=”zhangsan”?/>
input標簽內要指定name屬性，服務端才能獲取到對應的value
input內包含的組件類型 通過type指定：
text文本框password密碼框
radio單選框屬于同一組的選擇框name屬性要一致，不然單選框不能實現單選
checkbox復選框分組 同單選框單選框不加屬性時還不讓你選
file提供一個文件瀏覽按鈕，多用于上傳文件
hidden隱藏組件，不需用戶看到但服務端要用到，可通過JavaScript將其值在用戶端運算后再提交至服務端使用
button按鈕 通過onclick方法添加事件監聽
reset重置按鈕submit提交按鈕
p_w_picpath和submit一樣，但可通過src屬性指定一個圖片充當按鈕 美化效果
?
<select>選擇列表，默認單選下拉式設定multiple屬性使選項全部列出，無下拉效果
size屬性指定顯示多少項，顯示不完出現滾動條
通過<option></option>標簽封裝列表項
?
<textarea cols=””?rows=””>文本區域 可指定行數和列數
?
<fieleset>區域設置，可給form加外框外框上的文字可用legend標簽指定
?
form中的method指定提交方式，有7中，常用get和post
用Java自定義服務端與form交互 ?查看數據提交不同之處
get提交：信息顯示在地址欄中，敏感信息泄露，不安全；
地址欄存儲信息量有限，不利于大數據量提交；
將信息封裝在消息頭前邊；
提交至服務端的中文亂碼需要再次編碼后再解碼
post：地址欄上不顯示提交的信息，避免信息泄露，安全；
提交數據量無限制，方便大數據提交；
將信息封裝在消息頭后邊（空行后）的數據體中；
中文亂碼可通過設定字符集方法簡單搞定
Tomcat服務端默認使用的iso8859編碼，兩種提交方式提交中文時，服務端會顯示亂碼，需要在服務端使用指定字符集解碼，request.setCharacterEncoding(“GBK”)但設定字符集方法只對數據體中的數據有效，get方式提交的信息封裝在消息頭中，不能使用這種方法。但可以通過先用iso8859編碼再GBK解碼的方式解決。推薦使用post方式提交。
?
暴力提交、暴力注冊
<a href=”http://注冊地址?name=value&id=value......”>暴力開始</a>
超鏈接默認就是get方式提交
客戶端首先進行數據有效性校驗，服務端對客戶端提交的數據必須再次校驗
?
label標簽：用于給各元素定義快捷鍵
for屬性指定快捷鍵起作用的表單元素，其值必須與該表單元素的id值相同
accessKey指定快捷鍵，要與Alt合用
例：<label for=”user”?accessKey=”u”>user name</label>
<input type=”text”?id=”user”?/>
label使用技巧：
將label標簽加到tr標簽上，for屬性指向該tr里的文本框，在這行的任意位置點擊鼠標，文本框都將獲得焦點。
?
其他標簽：
<pre></pre>此標簽內封裝的文本數據格式將保持原樣，包括空格和縮進等格式。常用于頁面中顯示帶有縮進層次的代碼。
<p></p>段落標簽，兩個段落之間帶有空行
<b>加粗 <strong>加粗 <i>斜體 <u>下劃線 <sub>下標 <sup>上標
<marquee direction=”left/right/down/up”?behavior=”scroll/alternate/slide”>
此標簽內可以讓內容動起來，scroll滾動穿過/alternate來回彈/slide一下摔死
?
框架集frameset標簽：將瀏覽器頁面分成多個獨立的部分，分別顯示不同的頁面
放在head和body之間 ?frameset分割頁面 frame指定小頁面內容
<frameset rows=”30%, *”?frameborder=”yes”?border=”1”?framespacing=”0”>
<frame src=”1.html”?noresize=”noresize”?/>
<frame src=”2.html”?noresize=”noresize”?/>
</frameset>
frameset中用rows和cols屬性指定分割頁面大小區域，可用百分比也可用像素值
frame中的noresize屬性使框架頁面大小不可隨意改動
frame中添加的超鏈接默認都是在當前框架頁面內打開的，要讓其在當前窗口中的其他框架頁面中打開，需要將框架頁面添加一個name屬性，讓超鏈接的target屬性值等于這個框架頁面的name屬性即可
?
iframe畫中畫標簽：直接在當前頁面中挖出一個區域，顯示指定頁面內容
<iframe src=”1.html”?width=30 height=50>畫中畫標簽說明文字，這些文字在瀏覽器不支持iframe標簽時顯示</iframe>
畫中畫標簽具有一定的危險性，可能被用于隱藏執行一些惡意的代碼
如：<iframe src=”1.js”?height=0 width=0>
?
頭標簽<head>內的一些標簽：<title></title><base /><meta /><link />
title：頁面標題，顯示在瀏覽器標題欄上的文字
base：href指定頁面中所有超鏈接的目錄，可本地，也可網絡，結尾一定要用斜杠/表示
目錄，只作用于相對路徑文件。target指定打開方式
meta：<meta name=”keywords”?content=”電影，視頻，關鍵字……”?/>
<meta http-equiv=”refresh”?content=”3, url=http://www.xxx.com”?/>
http-equiv：模擬HTTP協議響應消息頭，3秒后刷新，打開指定網頁
link：給HTML關聯一些文件，如CSS，JS等
<link rel=”stylesheet”?href=”1.css”?media=”print/screen”>
rel指定關聯文件與HTML的關系 media指定文件作用的設備，多個設備斜杠分隔
?
XHTML是可擴展的（Extensible）超文本標記語言，可理解為HTML向XML的過渡。
XML是可擴展標記語言，是對數據信息的描述，而HTML是對數據顯示的描述。XML規定更為嚴格，如標簽不結束即錯誤。XML規范可被更多應用程序解釋，將成為一種通用的數據交換語言，各個服務器、框架都將XML作為配置文件。
Dreamweaver創建HTML文件自動生成的頭部信息中，又一個規范約束文件（.dtd），描述一些標簽信息，由此文件來約束標簽的自動閉合，刪除這些頭部信息后，DW中輸入標簽將不會自動閉合。前邊的網址并不代表此文件要從網絡獲取，只表示名稱空間，可自定義。
轉載于:https://blog.51cto.com/meyangyang/1976614
總結
- 上一篇： 3000元档超香二代骁龙8旗舰！努比亚Z
- 下一篇： 移动端HTML响应式布局之神奇的pt（自