HTML、CSS 和 JavaScript 基礎(chǔ)知識(shí)筆記
一~七，HTML
八~ 十三，CSS
十四~二十二，JavaScript
二十三，總結(jié)與后續(xù)學(xué)習(xí)建議
一、web前端介紹
三件套：HTML-頁(yè)面結(jié)構(gòu)，CSS-頁(yè)面樣式和布局，Javascipt交互和功能
二、安裝VScode開發(fā)環(huán)境
插件：Chinese (Simplified)+HTML css suport(css 快捷)+live server（實(shí)時(shí)顯示web頁(yè)面變化，不同步的話，把自動(dòng)保存關(guān)閉）+Auto Rename Tag(修改標(biāo)簽時(shí)，對(duì)配對(duì)標(biāo)簽同時(shí)修改)
三、HTML簡(jiǎn)介及環(huán)境搭建
HTML標(biāo)簽：控制文本格式
HTML文件結(jié)構(gòu)：
<!DOCTYPE html> --》告訴瀏覽器文件格式
<html> --》文件開始/結(jié)束
<head>--》文檔頭部，設(shè)置文檔的元信息
...
...
<head>
<body>--》實(shí)際顯示在瀏覽器的內(nèi)容
...
...
<body>
</html>
示例demo.html:
創(chuàng)建->生成.html結(jié)構(gòu)(快速生成，輸入感嘆號(hào))->右擊鼠標(biāo)（live server）
四、常用文本標(biāo)簽
- 標(biāo)題標(biāo)簽：6種 h1、h2...h6
- 段落標(biāo)簽：p(page)（段落）、b(bold)（加粗）、i(italic)（斜體）、u(underline)（下劃線）
- 有序列表與無(wú)序列表：ul li ;ol li
- 表格標(biāo)簽：table tr(table row) td(table data) th(table header)
五、HTML屬性
定義、語(yǔ)法：
適合大多數(shù)HTML元素的屬性：
<a href="https:/.../..." target="_blank">這是一個(gè)超鏈接 </a>
??href：hyper reference ,超鏈接
??target:打開方式，4種
hr:換行
??<img src="https:/.../..." alt="" width="200" height="100">
???img:嵌入圖像，實(shí)現(xiàn)圖像的顯示
六、html區(qū)塊-行內(nèi)元素和塊元素
塊元素：
最常用的兩個(gè)標(biāo)簽：
div:塊表簽，沒(méi)有任何語(yǔ)義，僅用于組織內(nèi)容，創(chuàng)建結(jié)構(gòu)
.nav #nav :快速生成同class，同id
span:行內(nèi)元素，用于內(nèi)聯(lián)、樣式化文本，給文本的一部分應(yīng)用樣式或標(biāo)記，通常與css，JS一起使用
七、HTML表單
表單：
實(shí)現(xiàn)：
浙公網(wǎng)安備 33010602011771號(hào)