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