準備工作
vscode下載
百度網盤 Subline Text 下載
Sublime Text下載
百度網盤 vscode 下載
Sublime Text 是一款輕量好用的文本編輯器，我們在寫前端代碼時，使用 Sublime Text 打開比使用記事本打開，得到的代碼體驗更好，比 vscode 更輕量；
Sublime Text使用
創建一個HTML文件
使用subline text 打開HTML文件，并用瀏覽器運行
HTML基礎
概念
HTML(Hyper Text Markup Language)，超文本標記語言；
超文本：
比文本要強大，通過鏈接和交互式方式來組織和呈現信息的文本形式，不僅僅有文本，還可能包含圖片，音頻，或者自已經審閱過它的學者所加的評注、補充或腳注等等；
標記語言：
由標簽構成的語言；
認識 HTML 標簽
HTML代碼是由"標簽"構成的，形如:
<h3>我是三級標題</h3>
- 標簽名(body) 放到<>中
- 大部分標簽成對出現：
<h3>為開始標簽，</h3>為結束標簽. - 少數標簽只有開始標簽，稱為"單標簽".
- 開始標簽和結束標簽之間，寫的是標簽的內容；
<h3 id="myId">我是三級標題</h3>
- 開始標簽中可能會帶有"屬性"，id屬性相當于給這個標簽設置了一個唯一的標識符(身份證號碼).
HTML 文件基本結構
<html><head><title>我是一個標簽</title></head><body><h1>我是一級標題</h1></body>
</html>
- html 標簽是整個html文件的
根標簽 (最頂層標簽)； - head 標簽中
寫頁面的屬性； - body 標簽中寫的是
頁面上顯示的內容； - title 標簽中寫的是
頁面的標題；
標簽之間的結構關系,構成了一個
DOM 樹，Document Object Mode(文檔對象模型)
雙擊打開 test.html 文件
剛開始我們沒寫 <head>， <body> 等標簽，在瀏覽器中依舊可以運行，因為瀏覽器有良好的“魯棒性”，哪怕代碼不規范，瀏覽器也能解析代碼。
使用 chrome 的開發者工具查看頁面的結構
F12 或者右鍵審查元素，開啟開發者工具，切換到Elements標簽，就可以看到頁面結構細節.
快速入門開發
開發工具：vscode
在 VS Code中創建文件 xxx.html
直接輸入! ，按 Enter或tab鍵，此時能自動生成代碼的主體框架.
點擊 ctrl+s保存代碼，然后在剛剛的文件夾中打開該文件
![27.[前端開發-JavaScript基礎]Day04-函數基本使用-遞歸-變量作用域-函數式編程](http://pic.xiahunao.cn/27.[前端開發-JavaScript基礎]Day04-函數基本使用-遞歸-變量作用域-函數式編程)
![P9420 [藍橋杯 2023 國 B] 雙子數--最高效的質數篩【埃拉托斯特尼篩法】](http://pic.xiahunao.cn/P9420 [藍橋杯 2023 國 B] 雙子數--最高效的質數篩【埃拉托斯特尼篩法】)
)
![[RH342]tcpdump](http://pic.xiahunao.cn/[RH342]tcpdump)
