??作者：小樹苗渴望變成參天大樹??
??作者宣言：認(rèn)真寫好每一篇博客??
??作者gitee:gitee?
??作者專欄：C語言,數(shù)據(jù)結(jié)構(gòu)初階,Linux,C++ 動態(tài)規(guī)劃算法??
如 果 你 喜 歡 作 者 的 文 章 ，就 給 作 者 點(diǎn) 點(diǎn) 關(guān) 注 吧！
前言
今天博主來介紹關(guān)于前端相關(guān)的知識，博主之前將的都是后端的知識，那什么是后端什么是前端？這個一會簡單介紹，那我們前端學(xué)習(xí)路徑是什么呢？這個都是我們一會說的，以及帶大家選擇前端的運(yùn)行環(huán)境安裝等介紹，話不多說，我們開始進(jìn)入正文部分的講解。
一、前端的概念以及運(yùn)行環(huán)境
這里博主就不在網(wǎng)上搜前端的概念給大家粘貼到這里了，博主就用自己的話進(jìn)行總結(jié)，前端就是進(jìn)行頁面展示給用戶看的，我們顯示器看到的內(nèi)容都屬于前端知識所呈現(xiàn)出來的，后端就是對我們的數(shù)據(jù)進(jìn)行邏輯處理，通過前端呈現(xiàn)給用戶。
前端的種類：
- web前端：我們看到的各種網(wǎng)頁
- 移動端前端：我們手機(jī)各種應(yīng)用界面
- PC端前端：電腦上各種應(yīng)用的界面
主要就是這些，還有一些其他的，但是博主所將的內(nèi)容主要是web前端，這也是我們?nèi)腴T比較簡單的一個分類渠道，所以接下來博主先帶大家搭建一下前端運(yùn)行環(huán)境，我們需要下載萬能的vsode，這個一個編輯器，靠插件完成代碼的運(yùn)行，我們打開官網(wǎng)，下載你電腦所對應(yīng)的安裝包。
我們雙擊我們的下載好的.exe文件，一路next就安裝成功了，vs code的安裝我認(rèn)為相比較其他環(huán)境的安裝要簡單的多。
你打開vs code會有一個界面，我們的原因時候我使用過了，但是你肯定有我圈住的三行，這三個都不需要關(guān)心，和我們寫代碼沒有任何關(guān)系，我們看因?yàn)椴环奖愕脑挘拖螺d一個中文插件：
我們需要重啟一下vs code就會變成中文的了
前端的代碼編寫：
- 我們的vs code不管編寫什么代碼，都需要創(chuàng)建一個文件夾進(jìn)行保存起來，然后打開這個文件，在這個文件夾下面創(chuàng)建文件。
- 然后我們快開始創(chuàng)建一個文件或者子文件夾：
- 創(chuàng)建html文件
上面三步這是我們寫任何程序都必須要做的一件事情，博主先簡單的寫一段代碼，具體含義后面介紹
<html>
<head>
<title>這是一個測試網(wǎng)頁</title>
</head>
<body>
hello world
</body>
</html>
- 我們發(fā)現(xiàn)這個代碼好多內(nèi)容都是成對出現(xiàn)的，我們在寫代碼的時候只要寫前面第一個，后面配對的就會直接出來，這是我們vs code插件的作用，下載下面這個插件：
- 我們怎么運(yùn)行這個程序呢？？
（1）打開你創(chuàng)建文件的文件夾，雙擊去運(yùn)行，但是比較麻煩
（2）安裝下面的插件，回到代碼界面，點(diǎn)擊右鍵，然后就可以直接運(yùn)行了
- 當(dāng)我們修改原代碼的時候，保存后繼續(xù)點(diǎn)擊運(yùn)行，網(wǎng)頁才會更新，這樣是我們不想要達(dá)到的效果。我們想要的是我們保存代碼后，直接在網(wǎng)頁上也更新，下載下面的插件：代碼界面右鍵點(diǎn)擊啟動
原理其實(shí)很簡單，就是我們本地起了一個一個程序幫助我們重新去運(yùn)行了
上面三個就會在我們開發(fā)的時候非常的方便了，大家下去自己去試試，先把自己的運(yùn)行環(huán)境弄好，在聽下面的講解
二、前端的講解思路以及html的基礎(chǔ)框架講解
我們前端也有許多模塊，是html,css,js這個三個部分，難度一次遞增的，最后博主寫根據(jù)前面學(xué)到的知識寫一個博客系統(tǒng)，讓大家感受一下前端代碼的效果，前面學(xué)知識知識為了讓那個大家看到一個知識點(diǎn)的效果，但是沒有把這些知識點(diǎn)結(jié)合起來，所以博客系統(tǒng)界面就相當(dāng)于前端的一個項(xiàng)目了，等到時候在給大家進(jìn)行講解，我們先進(jìn)入到HTML的學(xué)習(xí)
這個是最簡單的，但是界面不是太好看，所以他需要css來裝飾他，HTML是框架，css就相當(dāng)于靈魂。
我們在html文件里面隨便寫一句話：我們發(fā)現(xiàn)也是可以運(yùn)行的，并且也發(fā)現(xiàn)了第三個插件的效果，看IP和端口號就知道，是本地程序干的事情：
上面的程序雖然可以運(yùn)行但是不是標(biāo)準(zhǔn)的，一個正常的前端代碼是少不了標(biāo)簽的，有了標(biāo)簽就相當(dāng)于給你代碼快附上了名字，快速生成一個簡單的html框架代碼：
- 第一行是聲明文件的類型為HTML
- 第二行定義網(wǎng)頁的語言為英語,如果你要翻譯
我們看到如果是純英文的，你瀏覽器帶翻譯插件的話就會體現(xiàn)出來，這是一個英文頁面。- 第四行是瀏覽器的解碼方式 ：當(dāng)兩者不一致就是出現(xiàn)亂碼
- 第五行定義頁面的縮放比例，寬度根據(jù)設(shè)備寬度調(diào)整，初始縮放比例為100%，可以不用理解
- 第六行是標(biāo)題，出現(xiàn)在我們?yōu)g覽器上面的，第九行是正文
上面的每一行講解清楚了，但是大家應(yīng)該還發(fā)現(xiàn)了我們的有好多成對出現(xiàn)的，他們是雙標(biāo)簽，還有單標(biāo)簽，在下面介紹的時候會給大家講解，大家會發(fā)現(xiàn)有了這些標(biāo)簽，我們硬生生的文本就顯得格格不入，我們用標(biāo)簽來規(guī)定我們想要的效果，上面的標(biāo)簽還不能重復(fù)體現(xiàn)效果，后面講解的標(biāo)簽都會在正文部分體現(xiàn)（我們的標(biāo)簽有父子標(biāo)簽和兄弟標(biāo)簽，字面意思，head和body是兄弟，他倆同時是html的子標(biāo)簽，這個簡單了解一下就可以了）
這些標(biāo)簽形成了DOM數(shù)
三、標(biāo)簽的詳解
HTM L代碼是由“標(biāo)簽”構(gòu)成的<body>hello</body>
標(biāo)簽名 (body) 放到 < > 中
大部分標(biāo)簽成對出現(xiàn). 為開始標(biāo)簽, 為結(jié)束標(biāo)簽.
少數(shù)標(biāo)簽只有開始標(biāo)簽, 稱為 “單標(biāo)簽”.
開始標(biāo)簽和結(jié)束標(biāo)簽之間, 寫的是標(biāo)簽的內(nèi)容. (hello)
開始標(biāo)簽中可能會帶有 “屬性”. id 屬性相當(dāng)于給這個標(biāo)簽設(shè)置了一個唯一的標(biāo)識符(身份證號碼)
<body id="myId">hello</body>
雙標(biāo)簽不管修改哪一個，另一個也隨著會被修改，不需要修改兩次
3.1 注釋，標(biāo)題，段落標(biāo)簽
（1）注釋：選中要注釋的內(nèi)容，CTRL+/
我們寫的注釋可以通過上面的方式讓用戶看到，所以寫注釋的時候要注意，不能瞎寫
（2）標(biāo)題content
我們想要實(shí)現(xiàn)上面有標(biāo)題的效果：
我們的標(biāo)題標(biāo)簽一共有六種，一種比一種的字體小而細(xì)
（3）段落
content
（1）p 標(biāo)簽之間存在一個空隙
（2）當(dāng)前的 p 標(biāo)簽描述的段落, 前面還沒有縮進(jìn). (未來 CSS 會學(xué))
（3）自動根據(jù)瀏覽器寬度來決定排版.
（4）html 內(nèi)容首尾處的換行, 空格均無效.
（5）在 html 中文字之間輸入的多個空格只相當(dāng)于一個空格.
（6）html 中直接輸入換行不會真的換行, 而是相當(dāng)于一個空格
3.2換行，格式化，圖片標(biāo)簽
（1）我們的換行標(biāo)簽是一個單標(biāo)簽
br 是一個單標(biāo)簽(不需要結(jié)束標(biāo)簽)
br 標(biāo)簽不像 p 標(biāo)簽?zāi)菢訋в幸粋€很大的空隙.<br/>是規(guī)范寫法. 不建議寫成<br>
(2)格式化標(biāo)簽
加粗: strong 標(biāo)簽 和 b 標(biāo)簽
傾斜: em 標(biāo)簽 和 i 標(biāo)簽
刪除線: del 標(biāo)簽 和 s 標(biāo)簽
下劃線: ins 標(biāo)簽 和 u 標(biāo)簽
為什么會有兩種都是相同的相關(guān)，原因是第一個強(qiáng)調(diào)性強(qiáng)，一看就看出來了，在實(shí)際開發(fā)過程中我們正常使用css去也可以達(dá)到這樣的效果，后面講。
（3）圖片標(biāo)簽
img 標(biāo)簽必須帶有 src 屬性. 表示圖片的路徑
<img src="rose.jpg">
img標(biāo)簽的屬性：
- alt: 替換文本. 當(dāng)文本不能正確顯示的時候, 會顯示一個替換的文字.
- title: 提示文本. 鼠標(biāo)放到圖片上, 就會有提示.
- width/height: 控制寬度高度. 高度和寬度一般改一個就行, 另外一個會等比例縮放. 否則就會圖片
失衡. - border: 邊框, 參數(shù)是寬度的像素. 但是一般使用 CSS 來設(shè)定.
注意:
- 屬性可以有多個, 不能寫到標(biāo)簽之前
- 屬性之間用空格分割, 可以是多個空格, 也可以是換行.
- 屬性之間不分先后順序
- 屬性使用 “鍵值對” 的格式來表示.
img標(biāo)簽的其他用法
我們可以使用網(wǎng)絡(luò)路徑：
3.3 超鏈接標(biāo)簽
<a></a>
我們使用百度的時候會
那這就是一個超鏈接。
超鏈接的五種方式：
- 外部鏈接：href引用其他網(wǎng)站的地址
<a href="http://www.baidu.com">百度</a>
2. 內(nèi)部鏈接：href引用內(nèi)部頁面的鏈接，寫相對路徑即可
3. 空鏈接
我們不想跳轉(zhuǎn)，就想在當(dāng)前頁面
4. 網(wǎng)頁元素鏈接: 可以給圖片等任何元素添加鏈接(把元素放到 a 標(biāo)簽中)
5. 錨點(diǎn)鏈接: 可以快速定位到頁面中的某個位置
禁止 a 標(biāo)簽跳轉(zhuǎn): <a href="javascript:void(0);"> 或者 <a href="javascript:;">
大家下來做實(shí)驗(yàn)時候會發(fā)現(xiàn)他的跳轉(zhuǎn)會在一個當(dāng)前界面跳轉(zhuǎn)，如果我想重新加載一個界面跳轉(zhuǎn)怎么辦，使用target
href: 必須具備, 表示點(diǎn)擊后會跳轉(zhuǎn)到哪個頁面.
target: 打開方式. 默認(rèn)是 _self. 如果是 _blank 則用新的標(biāo)簽頁打開.
3.4表格標(biāo)簽
我們想要實(shí)現(xiàn)下面的表格效果
我們使用table標(biāo)簽
table 標(biāo)簽: 表示整個表格
tr: 表示表格的一行
td: 表示一個單元格
效果有點(diǎn)差距，但好歹有一個表格的形狀，我們?yōu)g覽器默認(rèn)邊框的像素是0，所以我們要進(jìn)行設(shè)置:使用給圖片一樣的屬性border:
還是不太對，我們每個單元格的邊框之間還有距離，因?yàn)槟J(rèn)的有2px所以我們需要使用下面的屬性：cellspacing
我們發(fā)現(xiàn)表格太小，并且位置不是居中的，大小我們使用witdh/height,居中我們使用align（參數(shù)left/center/right）
我們發(fā)現(xiàn)align只能讓表格整體進(jìn)行居中靠左靠右，里面的內(nèi)容不會發(fā)生變化，想要是內(nèi)容靠近單元格中間，使用cellpadding
上述屬性的介紹：
這些屬性都要放到 table 標(biāo)簽中.
- align 是表格相對于周圍元素的對齊方式. align=“center” (不是內(nèi)部元素的對齊方式)
- border 表示邊框. 1 表示有邊框(數(shù)字越大, 邊框越粗), “” 表示沒邊框.
- cellpadding: 內(nèi)容距離邊框的距離, 默認(rèn) 1 像素
- cellspacing: 單元格之間的距離. 默認(rèn)為 2 像素
- width / height: 設(shè)置尺寸.
注意, 這幾個屬性, vscode 都提示不出來.
上面只是針對表格做的操作，但是表格一般標(biāo)題和正文是不一樣的，像上面的有些操作樣式實(shí)際開發(fā)的時候由css去完成的，所以我們需要用不同的標(biāo)簽來區(qū)分標(biāo)題和正文：
th: 表示表頭單元格. 會居中加粗
thead: 表格的頭部區(qū)域(注意和 th 區(qū)分, 范圍是比 th 要大的)
tbody: 表格得到主體區(qū)域.
我們的使用標(biāo)題標(biāo)題會讓字體加粗居中
合并單元格：
步驟：
- 先確定跨行還是跨列
- 找好目標(biāo)單元格(跨列合并, 左側(cè)是目標(biāo)單元格; 跨行合并, 上方是目標(biāo)單元格)
- 刪除的多余的單元格
目標(biāo)效果：
我們在要合并的上一行或者左一行添加rowspan和colspan屬性，內(nèi)容是你要合并的單元格個數(shù)
我們只能往下或者往左合并，大家下來也可以自己去測試一下。
3.5 列表標(biāo)簽
我們有的時候需要給內(nèi)容增加列表標(biāo)簽顯示規(guī)律好看，起到分點(diǎn)的作用，那我們html怎么去實(shí)現(xiàn)呢？？
有三種列表標(biāo)簽的格式：
1. 無序列表[重要] ul li , .
2. 有序列表[用的不多] ol li
3. 自定義列表[重要] dl (總標(biāo)簽) dt (小標(biāo)題) dd (圍繞標(biāo)題來說明) 上面有個小標(biāo)題, 下面有幾個圍繞著標(biāo)題來展開的.
（1）無序列表
上面展示的就是無序列表，不是沒有順序，而是不需要順序
快速生成：ul>li*n,n就是幾行
我們發(fā)現(xiàn)這是圓形的，還有沒有其他形狀的，disc表示實(shí)心圓，square表示方塊，circle表示空心圓
(2) 有序列表
快速生成：ol>li*n,n就是幾行
有序列表不止這幾種：他類型有A/a/I/i/1,默認(rèn)就是1
不一定非的從1開始，還有一個屬性start
（3）自定義列表
注意：
-
元素之間是并列關(guān)系
-
ul/ol 中只能放 li 不能放其他標(biāo)簽, dl 中只能放 dt 和 dd
-
li 中可以放其他標(biāo)簽.
-
列表帶有自己的樣式, 可以使用 CSS 來修改. (例如前面的小圓點(diǎn)都會去掉)
3.6表單標(biāo)簽
表單標(biāo)簽是非常重要的，之前標(biāo)簽都是硬編碼進(jìn)網(wǎng)頁的，而表單標(biāo)簽可以收集用戶的數(shù)據(jù)，我們平時進(jìn)行身份注冊的時候，用的就是表單標(biāo)簽，還有百度搜索欄，所以表單標(biāo)簽作用很多，也就說明他的細(xì)節(jié)語法也更多，接下來我們來看看他的用法
表單是讓用戶輸入信息的重要途徑.
分成兩個部分:
- 表單域: 包含表單元素的區(qū)域. 重點(diǎn)是 form 標(biāo)簽.
- 表單控件: 輸入框, 提交按鈕等. 重點(diǎn)是 input 標(biāo)簽
我們將要實(shí)現(xiàn)的效果：
（1）form標(biāo)簽
描述了要把數(shù)據(jù)按照什么方式, 提交到哪個頁面中.
關(guān)于 form 需要結(jié)合 服務(wù)器 & 網(wǎng)絡(luò)編程 來進(jìn)一步理解. 后面再詳細(xì)研究.所以action的值先不寫
<form action="test.html" method="post">
... [form 的內(nèi)容]
</form>
我們表單里面的內(nèi)容將寫在這個表單域里面
（2）input 標(biāo)簽
這是我們表單控件之一，也是最重要的。
各種輸入控件, 單行文本框, 按鈕, 單選框, 復(fù)選框.
- type(必須有), 取值種類很多多, button, checkbox, text, file, image, password, radio 等.
- name: 給 input 起了個名字. 尤其是對于 單選按鈕, 具有相同的 name 才能多選一.
- value: input 中的默認(rèn)值.
- checked: 默認(rèn)被選中. (用于單選按鈕和多選按鈕)
- maxlength: 設(shè)定最大長度.
1.文本框（text）
<form action="">
姓名<input type="text" name="xingming" value="xu">
</form>
2. 密碼框(password)
<form action="">
密碼<input type="password" >
</form>
3.單選框（radio）
發(fā)現(xiàn)兩個都可以進(jìn)行選擇，明明是單選框?。?br>
注意: 單選框之間必須具備相同的 name 屬性, 才能實(shí)現(xiàn) 多選一 效果
4.復(fù)選框（checkbox）
<form action="">
<input type="checkbox" >睡覺
<input type="checkbox" >吃飯
<input type="checkbox" >玩游戲
</form>
5.普通按鈕（button）
<form action="">
<input type="button" >普通按鈕
</form>
當(dāng)前點(diǎn)擊了沒有反應(yīng). 需要搭配 JS 使用(后面會重點(diǎn)研究).
使用下面的方式可以讓大家感受確實(shí)有反應(yīng)
姓名<input type="button" name="xingming" onclick="alert('hello')">
6.提交按鈕（submit）
放在鏈接到形式傳給你想要訪問的內(nèi)容，form默認(rèn)是get方式傳遞的，post則會在正文部分傳。后面再介紹
7.清空表單（reset）
<form action="test1.html">
姓名<input type="text" name="xingming"><br/>
<input type="reset">
</form>
清空按鈕必須放在 form 中. 點(diǎn)擊后會將 form 內(nèi)所有的用戶輸入內(nèi)容重置
8.選擇文件(file)
<form action="test1.html">
<input type="file" >
</form>
(3)label標(biāo)簽
搭配 input 使用. 點(diǎn)擊 label 也能選中對應(yīng)的單選/復(fù)選框, 能夠提升用戶體驗(yàn).
在單/復(fù)選框中，我們只有點(diǎn)擊圓圈次啊可以選中，點(diǎn)擊文字沒有反應(yīng)，而label標(biāo)簽讓我們點(diǎn)擊文字也可以選中
<form action="test1.html">
<label for="man">男</label>
<input type="radio" name="sex" checked="checked" id="man">
<label for="woman">女</label>
<input type="radio" name="sex" id="woman">
</form>
復(fù)選框也是一樣的操作
（4）select標(biāo)簽
下拉菜單
option里面什么屬性都不寫就默認(rèn)第一個為初始值，使用selected的內(nèi)容用初始值
<option selected="selected">4</option>
（5）textarea標(biāo)簽
文本域中的內(nèi)容, 就是默認(rèn)內(nèi)容, 注意, 空格也會有影響.
超過區(qū)域就會出現(xiàn)滑動窗口
3.7無語義標(biāo)簽: div & span
div 標(biāo)簽, division 的縮寫, 含義是 分割
span 標(biāo)簽, 含義是跨度
就是兩個盒子. 用于網(wǎng)頁布局
div 是獨(dú)占一行的, 是一個大盒子.
span 不獨(dú)占一行, 是一個小盒子.
四、綜合練習(xí)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<h1>許東徽</h1>
</div>
<div>
<p>
<h2>基本信息</h2>
</p>
<p><img src="../圖片/1.png"></p>
<p>求職意向：C++開發(fā)</p>
<p>聯(lián)系電話：xxxx</p>
<p>郵箱：543615136@qq.com</p>
<p><a href="https://gitee.com/low-key123" target="_blank">我的gitee</a></p>
<p><a href="https://www.csdn.net/" target="_blank">我的博客</a></p>
</div>
<div>
<p>
<h2>教育背景</h2>
</p>
<ol>
<li>小學(xué)</li>
<li>初中</li>
<li>高中</li>
<li>大學(xué)</li>
</ol>
</div>
<div>
<p>
<h2>專業(yè)技能</h2>
</p>
<ul>
<li>c語言</li>
<li>數(shù)據(jù)結(jié)構(gòu)</li>
<li>c++</li>
<li>Linux</li>
</ul>
</div>
<div>
<p>
<h2>項(xiàng)目經(jīng)歷</h2>
</p>
<ol>
<li>
<h3>留言墻</h3>
</li>
<p>開發(fā)時間：24-3-1 到 23-3-8</p>
<p>功能介紹：</p>
<ul type="circle">
<li>支持留言發(fā)布</li>
<li>支持匿名留言</li>
</ul>
<li>
<h3>學(xué)習(xí)小助手</h3>
<p>開發(fā)時間：24-1-9 到 24-2-14</p>
<p>功能介紹：</p>
<ul type="circle">
<li>支持錯題檢索</li>
<li>支持同學(xué)探討</li>
</ul>
</li>
</ol>
</div>
<div>
<p><h2>個人評價</h2></p>
<span>熱愛編程</span>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<table width="500" height="100" >
<form acton="">
<thead cellpadding="0">
<th><h3>請?zhí)顚懞啔v信息</h3></th>
</thead>
<tr>
<td>姓名</td>
<td><input type="text"><br /></td>
</tr>
<tr>
<td> 性別</td>
<td>
<input type="radio" name="sex" checked="checked" id="man">
<img src="../圖片/男.png" alt="男 width=" 18" height="18">
<label for="man">男</label>
<input type="radio" name="sex" id="woman">
<img src="../圖片/女.png" alt="女 width=" 18" height="18">
<label for="woman">女</label><br />
</td>
</tr>
<tr>
<td>出生日期</td>
<td>
<select>
<option selected="selected">--請選擇年份--</option>
<option>2000</option>
<option>2001</option>
<option>2002</option>
<option>2003</option>
</select>
<select>
<option selected="selected">--請選擇月份--</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
<select>
<option selected="selected">--請選擇日期--</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select><br />
</td>
</tr>
<tr>
<td>
<label for="shcool">就讀學(xué)校</label>
</td>
<td><input type="text" id="shcool"><br /></td>
</tr>
<tr>
<td> 應(yīng)聘崗位</td>
<td>
<input type="checkbox" id="1">
<label for="1">前端</label>
<input type="checkbox" id="2">
<label for="2">Java</label>
<input type="checkbox" id="3">
<label for="3">PHP</label>
<input type="checkbox" id="4">
<label for="4">UI</label>
<br />
</td>
</tr>
<tr>
<td>掌握到技能</td>
<td> <textarea rows="10" cols="30"></textarea><br /></td>
</tr>
<tr>
<td>
項(xiàng)目經(jīng)歷</td>
<td> <textarea rows="10" cols="30"></textarea><br /></td>
</tr>
<tr>
<td> </td>
<td><input type="checkbox">我已仔細(xì)閱讀過公司的招聘要求<br /></td>
</tr>
<tr>
<td></td>
<td><a href="#">查看我的狀態(tài)</a></td>
</tr>
<tr>
<td></td>
<td>
<div>
<h2>請應(yīng)聘者確認(rèn)：</h2>
<ul>
<li>以上信息真實(shí)有效</li>
<li>能夠盡早去公司實(shí)現(xiàn)</li>
<li>能接受公司的加班文化</li>
</ul>
</div>
</td>
</tr>
</form>
</table>
</body>
</html>
五、特殊字符
有些特殊的字符在 html 文件中是不能直接表示的, 例如:
空格: ?
小于號: <
大于號: >
按位與: &
html 標(biāo)簽就是用 < > 表示的. 因此內(nèi)容里如果存在 < > , 就會發(fā)生混淆.特殊字符文章來源：http://www.zghlxwxcb.cn/news/detail-838900.html
六、Emmet 快捷鍵
- 快速輸入標(biāo)簽
input[tab]
- 快速輸入多個標(biāo)簽
div*3[tab]
- 標(biāo)簽帶id
div#sex[tab]
- 標(biāo)簽帶類名
div.sex[tab]
- 標(biāo)簽帶子元素
ul>li*3[tab]
- 標(biāo)簽帶兄弟元素
span+span
- 標(biāo)簽帶內(nèi)容
div{hello}
- 標(biāo)簽帶內(nèi)容(帶編號)
div{$.hello}
七、總結(jié)
通過這篇的學(xué)習(xí)，你已經(jīng)開始入門前端來，后面的知識會更多，希望大家下來可以自己去認(rèn)真的敲代碼，熟能生巧，接下來博主講解css的知識點(diǎn)了文章來源地址http://www.zghlxwxcb.cn/news/detail-838900.html
到了這里，關(guān)于【前端】-初始前端以及html的學(xué)習(xí)的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
