1 什么是HTML
HTML其實是Hypertext Markup Language的縮寫，即超文本標記語言。
HTML的后綴名：.html
那么什么是超文本標記語言？
2 HTML的作用
給純文本添加語義。其實就是告訴瀏覽器，我要表示的是什么。
第一步：我們可以新建一個文本，復(fù)制一段名人的介紹
第二步：修該文本的后綴名，以瀏覽器方式打開
第三步：再使用文本打開，在開頭與結(jié)尾添加如下標簽
<h1>內(nèi)容</h1>，<p>內(nèi)容</p>
第四步：保存修改后的文本，使用瀏覽器打開，發(fā)現(xiàn)樣式好看了很多。
結(jié)論：<p>內(nèi)容</p>用來描述其他文本語義的文本，我們稱為標簽。這些用來描述文本語義的標簽是不會在瀏覽器中顯示的。我們稱這些文本為超文本，這些文本又叫做標簽，所以就稱HTML為超文本標記語言。
注意點：
剛才使用<h1>內(nèi)容</h1>只是用來給文本添加語義，告訴瀏覽器這是標題文本，而不是修改了文本的樣式，加粗等。所以學(xué)習(xí)的童鞋要注意。。。
3 HTML發(fā)展史
在1993年6月作為[互聯(lián)網(wǎng)]工程工作小組IETF工作草案發(fā)布并非標準
HTML 2.0——1995年11月作為RFC 1866發(fā)布，在RFC 2854于2000年6月發(fā)布之后被宣布已經(jīng)過時
HTML 3.2——1997年1月14日，W3C推薦標準
HTML 4.0——1997年12月18日，W3C推薦標準
HTML 4.01（微小改進）——1999年12月24日，W3C推薦標準
HTML 5——2014年10月28日，W3C推薦標準ISO/IEC 15445:2000（“ISO HTML”）——2000年5月15日發(fā)布，基于嚴格的HTML 4.01語法，是國際標準化組織和國際電工委員會的標準。
4 第一個HTML程序
基本結(jié)構(gòu)
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
切記要修改它的后綴名.html
5 HTML標簽詳解
<html> // HTML開始標簽
<head> // 頭部開始標簽
<title></title>
</head> // 頭部結(jié)束標簽
<body> // 內(nèi)容開始標簽
</body> // 內(nèi)容結(jié)束標簽
</html> // 結(jié)束標簽
- html標簽
- 作用：
告訴瀏覽器這是一個網(wǎng)頁，即是一個HTML文檔 - head標簽
- 作用：
用于給網(wǎng)站添加一些配置信息，這部分內(nèi)容都不會給用戶看 - 例如：
- 百度網(wǎng)址的標題/小Logo等
- 還有攜帶一些文件（css/js）
-
警告，添加一些瀏覽器安全組件等
沒有回車之前
- title標簽
- 作用：
- 專門用于網(wǎng)站的標題
- 例如：
我們保存網(wǎng)站的時候，會出現(xiàn)一個標題，這個標題就是title的內(nèi)容
- 作用：
- body標簽
- 作用：
就是展示給用戶看的內(nèi)容（文字/圖片/音/視頻），在學(xué)習(xí)這個標簽后，要將內(nèi)容寫入這個body中，而且在<html>標簽中，只能有一個body標簽
6 HTML字符集問題
其實很多情況下，我們會遇到亂碼問題。這個就是字符集問題，即編碼問題
這是什么意思？表示編碼格式
- meta標簽的作用就是制定網(wǎng)頁的字符集
- 要解決亂碼問題，就需要在head標簽中添加
<meta charset="GBK"/> - 常見的字符集GBK/UTF-8
- GBK(GB2312)里面的漢子比較少，還存儲了一部分常用外文
- UTF-8里面存儲的世界上所有的文字，所以以后直接使用它就可以了
關(guān)于UTF-8的一些問題
-
如果使用UTF-8編碼格式，那么必須在保存的時候選擇UTF-8格式，否則即便制定了字體，也無法正常顯示。
image.png
7 標簽認識
- 單標簽
- 有開始標簽沒有結(jié)束標簽，也就是由一個<>組成的
<meta charset="utf-8"/>
- 雙標簽
- 有開始和結(jié)束標簽，也就是由一個<>和</>組成
<html>
</html>
- 標簽關(guān)系
- 并列關(guān)系
<head>
</head>
<body>
</body>
- 嵌套關(guān)系
<head>
<title>
</title>
</head>
8 DOCTYPE文檔聲明
- 因為HTML有很多個版本，一般在HTML文件的第一行告訴瀏覽器我們用的是什么版本
- 不同的HTML版本都有不同的DTD文檔聲明
<!DOCTYPE html> // 這是HTML5版本的文檔聲明，可以使用小寫，向下兼容，所以以后就寫著一句就可以了
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
參考資料：W3C
9 CSS了解
如果在一些版本中不支持下面的寫法，就需要使用CSS寫法
-
設(shè)置字體為7號，顏色為紅色
image.png
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>雷潮博客-886</title>
</head>
<body>
<font size=7 color= red>雷潮</font>
</body>
</html>
- CSS寫法,修改字體樣式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>雷潮博客-886</title>
<style type="text/css">
p{
font-size: 100px;
color: red;
font-family: "黑體";
}
</style>
</head>
<body>
<font size=7 color= red face="宋體">雷潮</font>
<p>這是雷潮886</p>
</body>
</html>
10 .htm和.html的區(qū)別
其實就是DOS系統(tǒng)只支持長度為3的后綴名，不支持4位后綴名。而Windows下.html是長文件命名
11 XHTML和HTML與HTML5的區(qū)別
- XHTML
標簽必須小寫，必須嚴格閉合，屬性必須用引號加注等 - HTML
語法寬松容 - HTML5
HTML的下一個版本，非常寬松容錯率強，同時增加了很多特性
