HTML學習筆記 2016年12月15日整理 Chapter1 1. 1. scheme: 定義網際網路服務的類型,常見的為http 2. host: 定義域主機(http的預設主機是www) 3. domain: 定義網際網路功能變數名稱 4. port: 定義埠號,預設是埠80 5. path: 網頁在 ...
HTML學習筆記
2016年12月15日整理
Chapter1
URL(scheme://host.domain:port/path/filename)
- scheme: 定義網際網路服務的類型,常見的為http
- host: 定義域主機(http的預設主機是www)
- domain: 定義網際網路功能變數名稱
- port: 定義埠號,預設是埠80
- path: 網頁在伺服器上的路徑
- filename: 文件名稱
- htm & html 文件名的區別:
- 之前的老版本系統只支持顯示3位的文件名尾碼,所以使用htm
- 現在統一使用html
- 單標簽 & 雙標簽:
- 單標簽:
<!--註釋-->
,<br />
,<hr />
,<img>
- 雙標簽:
<p></p>
,<h1><h1>
-<h6><h6>
...
- 單標簽:
- 標簽關係:
- 併列關係
- 嵌套關係
- html中,除了語義,其他什麼都沒有
- HTML 超文本標記語言,從語義的角度描述頁面結構
- CSS 層疊式樣式表,從審美的角度負責頁面樣式
JS JavaScript,從交互的角度描述頁面行為
標簽有什麼作用? 1. 給文本增加主XXX的語義 2. 。。。
Chapter2
form
的method: get/post
- get: 通過地址欄的方式進行明文數據提交,將用戶輸入的信息拼接在地址欄最後
- post: 數據通過後臺打包處理進行提交,不會將用戶信息顯示出來,安全性較高
form
控制項1. <input type="text" id="" name="" value="" maxlength="6" readonly="readonly" disabled="disabled"> 2. <input type="password"> 3. <input type="radio" name="" checked="checked"> 實現單選效果一定要給控制項設置相同的名稱 4. <input type="image" src=""> 5. <input type="checkbox" checked="checked"> 6. <input type="file"> 7. <input type="reset"> 8. <input type="submit"> 9. <input type="button"> 10. <select name="" id="" multiple="multiple"> <optgroup label=""> <option value=""></option> <option value=""></option> <option value=""></option> </optgroup> </select> 11. <textarea cols="30" rows="10" style="resize: none;"></textarea> 12. <fieldset> <legend>...</legend> </fieldset> **HTML5新增** 13. <input type="url"> 14. <input type="email"> 15. <input type="date"> 16. <input type="time"> 17. <input type="number"> 18. <input type="range" max="100" step="5"> 19. 什麼表單元素都有label
- 標簽語義化
- 儘可能少的使用無語義的標簽
div
和span
; - 在語義不明顯時,既可以使用
div
或者p
時,儘量用有語義的標簽; - 不要使用純樣式標簽,如:
b
、font
、u
等,改用css設置(做小掛件,精靈圖除外); - 需要強調的文本,可以包含在
strong
或者em
標簽中strong
預設樣式是加粗(不要用b
),em
是斜體(不用i
)。
- 儘可能少的使用無語義的標簽
- 字型檔
UTF-8
和gb2312
UTF-8
是國際通用字型檔,裡面涵蓋了所有地球上所有人類的語言文字,比如阿拉伯文、漢語...gb2312
是國標,是中國的字型檔,裡面僅涵蓋了漢字和一些常用外文,比如日文片假名,和常見的符號。- 字型檔規模:
UTF-8
(字全) >gb2312
(只有漢字) - 保存大小:
UTF-8
(更臃腫、載入更慢) >gb2312
(更小巧,載入更快) UTF-8
裡面存儲一個漢字3個位元組。而gb2312
中存儲一個漢字2個位元組。
- SEO(search engine optimization) 搜索引擎優化
<meta name="Keywords" content=" " />
<meta name="Description" content=" " />
<h1></h1>
到<h6></h6
> 是容器級的標簽,理論上裡面可以放置p
、ul
,但在語義上,不要這麼寫。- 容器級 & 文本級
- 容器級的標簽:裡面可以放置任何東西
- 文本級的標簽:裡面只能放置文字、圖片、表單元素,eg.
<p></p>
p
是一個文本級的標簽,p 裡面只能放文字、圖片、表單元素
DTD:文檔類型聲明Doc Type Declaration。一共有7種DTD,3種HTML4.01的,3種XHTML1.0的,1種HTML5的
錨點
<a name="anchor"></a> <a id="anchor"></a>
li
不能單獨存在,必須包裹在ul
裡面;反過來說,ul
的“兒子”不能是別的東西,只能有li
。
li
是一個容器級標簽,li
裡面什麼都能放根據語義來使用標簽,而不是根據標簽的錶面效果