- 1、 更改文件擴展名：f2
- 2、HTML就只有一個作用, 它是專門用來描述文本的語義的. 也就是說我們可以利用HTML來告訴瀏覽器哪些是標題, 哪些是段落.
- 3、HTML其實是HyperText Markup Language的縮寫, 超文本標記語言
- 4、企業開發代碼文件，必須用英文或者拼音命名
- 5.html發展史:
1993--IETF HTML1.0
1995--w3c HTML2.0
1999--w3c HTML4.01
2004--HTML草案
2008--HTML5正式版
什么是URL
- 1.我們在瀏覽器的地址欄中輸入的地址其實就是URL
- 2.URL格式：127.0.0.1/index.html （瀏覽器會自動補全http:和：80）
http://127.0.0.1/index.html （瀏覽器會自動補全：80）
http://127.0.0.1:80/index.html （完整格式）
協議類型://ip地址:端口號/資源路徑/資源名稱
補充
- URL全稱Uniform Resource Locator(統一資源定位符)， 互聯網上的每一個資源都有一個唯一的URL地址
- 由于IP地址全都是數字， 沒有任何的含義，比較難以記憶。 所以在訪問網頁時最-
常見的不是IP地址而是“域名”（一串有含義的字母OR數字） - 好比： http://www.baidu.com AND http://111.13.100.92:80/
什么是HTTP協議
- .HTTP是Hypertext Transfer Protocol的縮寫, 超文本傳輸協議
什么是HTML
- HTML其實是HyperText Markup Language的縮寫, 超文本標記語言
HTML的作用
HTML就只有一個作用, 它是專門用來描述文本的語義的. 也就是說我們可以利用HTML來告訴瀏覽器哪些是標題, 哪些是段落.
這些用于描述其它文本語義的文本, 我們稱之為標簽. 并且這些用于描述文本語義的標簽將來在瀏覽器中是不會被顯示出來的
所以正是因為HTML的這些標簽是專門用來描述其它文本語義的, 并且在瀏覽器中不會被顯示出來, 所以我們稱這些文本為"超文本", 而這些文本又叫做標簽, 所以HTML被稱之為"超文本標記語言"
html標簽
作用:
用于告訴瀏覽器這是一個網頁, 也就是說告訴瀏覽器我是一個HTML文檔-
注意點:
- 其它所有的標簽都必須寫在html標簽里面, 也就是寫在html開始標簽和結束標簽中間
head標簽
-
作用:
- 用于給網站添加一些配置信息
例如: - 指定網站的標題 / 指定網站的小圖片
- 添加網站的SEO相關的信息(指定網站的關鍵字/指定網站的描述信息)
- 外掛一些外部的css/js文件
- 添加一些瀏覽器適配相關的內容
- 用于給網站添加一些配置信息
注意點:
一般情況下, 寫在head標簽內部的內容都不會顯示給用戶查看, 也就是說一般情況下寫在head標簽內部的內容我們都看不到
title標簽
作用:
專門用于指定網站的標題, 并且這個指定的標題將來還會作為用戶保存網站的默認標題
-
注意點:
- title標簽必須寫在head標簽里面
body標簽
作用:
專門用于定義HTML文檔中需要顯示給用戶查看的內容(文字/圖片/音頻/視頻)
注意點:雖然說有時候你可能將內容寫到了別的地方在網頁中也能看到, 但是千萬不要這么干, 一定要將需要顯示的內容寫在body中
一對html標簽中(一個html開始標簽和一個html結束標簽)只能有一對body標簽
meta標簽
如何解決亂碼現象?
在head標簽中添加<meta charset="GBK" />, 指定字符集
-
GBK(GB2312)和UTF-8區別
- GBK(GB2312)里面存儲的字符比較少, 僅僅存儲了漢字和一些常用外文
體積比較小 - UTF-8里面存儲的世界上所有的文字
體積比較大
- GBK(GB2312)里面存儲的字符比較少, 僅僅存儲了漢字和一些常用外文
-
那么在企業開發中我們應該使用GBK(GB2312)還是UTF-8呢?
- 如果你的網站僅僅包含中文, 那么推薦使用GB2312, 因為它的體積更小, 訪問速度更快
- 如果你的網站除了中文以外, 還包含了一些其它國家的語言 , 那么推薦使用UTF-8
- 懶人推薦: 不管三七二十一, 一律寫UTF-8即可
-
注意點:
- 在HTML文件中指定的字符集必須和保存這個文件的字符集一致, 否則還是會出現亂碼
- 所以僅僅指定字符集不一定能解決亂碼問題, 還需要保存文件的時候, 文件的保存格式必須和指定的字符集一致才能保證沒有亂碼問題
HTML標簽
HTML標簽分類
- 單標簽
只有開始標簽沒有結束標簽, 也就是由一個<>組成的
<meta charset="UTF-8" />
- 雙標簽
有開始標簽和結束標簽, 也就是由一個<>和一個</>組成的
<html>
</html>
HTML標簽關系分類
- 并列關系(兄弟/平級)
<head>
</head>
<body>
</body>
- 嵌套關系(父子/上下級)
<head>
<meta charset="UTF-8" />
<title>百度一下,你就知道123</title>
</head>
DTD文檔聲明
- DTD文檔聲明格式:
<!DOCTYPE html>
注意事項:
-<!DOCTYPE>聲明必須是 HTML 文檔的第一行，位于 <html> 標簽之前
<!DOCTYPE> 聲明不是 HTML 標簽
<!DOCTYPE> 聲明沒有結束標簽
<!DOCTYPE> 聲明對大小寫不敏感
這個聲明瀏覽器會看, 但是并不是完全依賴于這個聲明, 瀏覽器有一套自己的默認的處理機制
不寫也能運行
H5網頁里面用H4也能運行
htm 和 .html擴展名區別
- DOS操作系統（win95或win98）下只能支持長度為3的后綴名，所以是htm
- 但在windows后綴長度可以大于3位，所以windows下無所謂htm與html，html是為長文件的格式命名的
- 所以htm是為了兼容過去的DOS命名格式存在的
WebStorm常見快捷鍵
- 如何在WebStorm中利用快捷鍵創建一個新的.html的文件
同時按下鍵盤上的Ctrl + Alt + Insert
- 如何在WebStorm中讓光標移動到當前行的末尾
按下鍵盤上的End鍵即可
- 如何在WebStorm中讓光標移動到當前行的最前面
按下鍵盤上的Home鍵即可
- 如何在WebStorm中讓光標在多行中閃爍
按住鍵盤上的Alt鍵不放, 然后再按住鼠標的左鍵不放, 然后再拖動鼠標即可
- 如何在WebStorm中快速的復制光標所在的那一行
按下鍵盤上的Ctrl + D
- 如何在WebStorm中快速的刪除光標所在的那一行
按下鍵盤上的Ctrl + X
- 如何在WebStorm中讓標簽包裹一段內容, 也就是自動在一段內容前后加上標簽
按下鍵盤上的Ctrl + Alt + T, 然后按下回車, 然后輸入對應的標簽即可
基礎標簽學習
H系列標簽(Header 1~Header 6)
作用:
- 用于給文本添加標題語義
- 格式:
-<h1>xxxxxx</h1>
- 注意點:
- H標簽是用來給文本添加標題語義的, 而不是用來修改文本的樣式的
- H標簽一共有6個, 從H1~H6, 最多就只能到6, 超過6則無效
- 被H系列標簽包裹的內容會獨占一行
- 在H系列的標簽中, H1最大, H6最小
- 在企業開發中, 一定要慎用H系列的標簽, 特別是H1標簽. 在企業開發中一般情況下一個界面中只能出現一個H1標簽(和SEO有關)
P標簽(Paragraph)
- 作用:
- 告訴瀏覽器哪些文字是一個段落
- 格式:
-<p>xxxxxxxx</p>
- 注意點:
- 在瀏覽器中會單獨占一行
Hr標簽(Horizontal Rule)
- 作用:
- 在瀏覽器上顯示一條分割線
- 格式:
<hr />
- 注意點:
- 在瀏覽器中會單獨占一行
- 通過我的觀察發現HR標簽可以寫/也可以不寫/, 如果不寫/那么就是按照HTML的規范來編寫, 如果寫上/那么就是按照XHTML的規范來編寫.但是在HTML5中, 由于HTML5兼容HTML和XHTML所有寫不寫都可以.那么以后我們在做前端開發時到底寫還是不寫呢? 按照高級開發工具的提示來寫即可.
- 由于hr標簽是用來修改樣式的, 所以不推薦使用. 今后開發中添加水平線一般都使用CSS盒子來做
