2022前端知识整理：1、HTML+CSS基本

9q13nh

1、HTML+CSS基本

2022前端知识整理：重点包括HTML基本和CSS基本部分，学完之后能够搭出一个简单的前端静态页面。

1、web标准的形成：

形成语言说明结构HTML页面元素表现CSS页面样式行径JavaScript页面交互

2、HTML

（Hyper Text Markup Language）中文译为：超文本标记语言

3、VS code

必须安装的插件

Auto Rename TagChinese (Simplified) (简体中文) Language Pack for Visual Studio Codecode settings syncError LensESLintGitLens — Git superchargedJSON to TSLive ServerOne Dark ProPrettier ESLintSettings SyncTypeScript Vue Plugin (Volar)Vue Language Features (Volar)Vue VSCode SnippetsVueHelperVeturVue 3 Snippets

4、HTML基本

排版标签

标题标签 h1 h2 h3 h4 h5 h6段落标签 p换行标签 br水平线标签 hr

文本格式化标签

b，strong 加粗u，ins 下划线i，em 倾斜s，del 删除线

媒介标签

img，{src，alt，title，weight，height} 照片../，./ 路径audio，{src，controls} 音频video，{src，controls} 视频

链接标签

a，{herf，target，title，weight，height} 超链接

列表标签

ul，li 没序列表ol，li 有序列表dl，dt，dd 自定义列表

表格标签

table 表格整体tr 表格每行td 表格每一个单元格border，width，height 表格属性 caption 表格外边大标题

th 表格第1行的小标题

thead，tobody，tfoot 表格结构标签

rowspan，colspan 跨行合并，跨列合并

表单标签

input，{text，password，radio，checkbox，file，submit，reset，button} 输入框，选取框，按钮button，{submit，reset，button} 按钮td 表格每一个单元格select，{selected，option} 下拉菜单 textarea，{cols，rows} 文本域

label 运用label标签将表单内容包裹起来

语义化标签

没语意的布局标签：实质的功效必须研发者自己定义

div 独霸一行span 一行多个

有语义的的布局标签：header头部，nav导航，footer底部，aside侧边栏，section区块，article文案

字符实体

&nbsp 空格&gt 大于&lt 少于&amp 和&quot 双引号&apos 单引号

5、CSS基本

CSS引入方式

内嵌式、外联式、行内式

基本选取器

标签选取器 p{}，类选取器 .class{}，id 选取器 #value{}，通配符选取器 *{}

class类名能够重复，一个标签能够同期有多个class类名；id属性值不可重复，一个标签只能有一个id属性值

字体和文本样式

字体样式：字体体积：font-size，字体粗细：font-weight，字体样式：font-style，字体类型：font-family，字体类型：font属性连写

文本样式：文本缩进：text-indent，文本水平对齐：text-align，文本修饰：text-decoration，行高：line-height

chorme调试工具（略）

颜色取值

rgb暗示法 rgb ( 255 , 255 , 255 ) ：白色

rgba暗示法

流星的美

“NB”（牛×的缩写，表示叹为观止）‌

b1gc8v

楼主节操掉了，还不快捡起来！

qzmjef

i免费外链发布平台 http://www.fok120.com/

1fy07h

认真阅读了楼主的帖子，非常有益。