名师力作,纵享前端学习丝滑开场!尚硅谷禹神版前端入门教程发布!
一、上手易
禹神一出手,就知有没有。教程竭尽用心,对初学者极度友好,入门不易理解的浮动、定位、变换、过渡、动画等知识点,均配备了精细的3D模型图和演示案例,让你看得更直观,学得更轻松!
这不仅仅是一套视频,每一个知识点、每一次总结、每一张图示、各种注意事项等,均整理汇总成了笔记,堪称视频学习最佳拍档,帮你大大节省了学习时间,可以方便快速地复习、练习、备查。充分考虑到初学的所有痛点,只有你们想不到,没有这套教程做不到!
二、实战强
对标实际应用讲解,知识点精心排序,如CSS 选择器,将 CSS2 和CSS3 中所有的选择器一次性介绍完,因为在实际开发中,更关注是如何快速而又精准的选中元素。教程不只停留在理论学习,更是让你的学习顺序就是一个顺应真实开发的顺序!
教程采用专业的网页设计软件Figma,制作企业级高保真设计稿,不再使用老掉牙的标注图,让你学习时拿到的设计稿,就是实际开发中所用的设计稿。手把手带你1比1精准还原设计稿,无缝衔接企业级真实项目!
全程使用目前主流的Vscode编辑器,并对安装、设置、插件均进行了细致的讲解。
三、内容深
对于小白容易模糊的知识点,全部进行了从概念到应用的细致剖析,让你知其然更知其所以然。例如:选择器权重到底怎么计算、vertical-align到底是什么在对齐、BFC到底是个什么东西……让你从开始就夯实基础,扫清障碍,不为后续学习埋雷!
![](https://i-blog.csdnimg.cn/blog_migrate/075763b088ac070ad11858e4fedc69ff.png)
教程目录
001.教程简介
002.认识两位先驱
003.计算机基础
004.CS架构与BS架构
005.浏览器相关知识
006.网页相关概念
007.HTML简介
008.准备工作
009.HTML初体验
010.HTML标签
011.HTML标签属性
012.HTML基本结构
013.安装VSCode
014.安装LiveServer插件
015.HTML注释
016.HTML文档声明
017.HTML字符编码
018.HTML设置语言
019.HTML标准结构
020.开发者文档
021.HTML排版标签
022.HTML语义化标签
023.块级元素与行内元素
024.常用的文本标签
025.不常用的文本标签
026.HTML图片标签
027.相对路径_绝对路径
028.常见图片格式_1
029.常见图片格式_2
030.超链接_跳转页面
031.超链接_跳转文件
032.超链接_跳转锚点
033.超链接_唤起指定应用
034.超文本的真正含义
035.列表
036.列表_注意事项
037.表格_基本结构
038.表格_常用属性
039.表格_跨行与跨列
040.补充几个常用标签
041.表单_基本结构
042.表单_文本框与密码框
043.表单_单选框与多选框
044.表单_隐藏域
045.表单_提交与重置
046.表单_普通按钮
047.表格_文本域和下拉框
048.表单_禁用表单控件
049.表单_label标签
050.表单_fieldset与legend
051.表单_总结
052.框架标签
053.HTML字符实体
054.HTML全局属性
055.meta元信息
056.HTML总结
057.CSS_简介
058.CSS_行内样式
059.CSS_内部样式
060.CSS_外部样式
061.CSS_样式表优先级
062.CSS_语法规范
063.CSS_代码风格
064.CSS_通配选择器
065.CSS_元素选择器
066.CSS_类选择器
067.CSS_ID选择器
068.CSS_交集选择器
069.CSS_并集选择器
070.CSS_HTML元素间的关系
071.CSS_后代选择器
072.CSS_子代选择器
073.CSS_兄弟选择器
074.CSS_属性选择器
075.CSS_伪类选择器_概念
076.CSS_伪类选择器_动态伪类
077.CSS_伪类选择器_结构伪类1
078.CSS_伪类选择器_结构伪类2
079.CSS_伪类选择器_结构伪类3
080.CSS_伪类选择器_否定伪类
081.CSS_伪类选择器_UI伪类
082.CSS_伪类选择器_目标伪类
083.CSS_伪类选择器_语言伪类
084.CSS_伪元素选择器
085.CSS_选择器优先级_简单聊
086.CSS_选择器优先级_详细聊
087.CSS_三大特性
088.CSS_聊聊像素
089.CSS_颜色_第1种表示_颜色名
090.CSS_颜色_第2种表示_rgb与rgba
091.CSS_颜色_第3种表示_HEX与HEXA
092.CSS_颜色_第4种表示_HSL与HSLA
093.CSS_常用字体属性_字体大小
094.CSS_常用字体属性_字体族
095.CSS_常用字体属性_字体风格
096.CSS_常用字体属性_字体粗细
097.CSS_常用字体属性_字体复合属性
098.CSS_常用文本属性_文本颜色
099.CSS_常用文本属性_文本间距
100.CSS_常用文本属性_文本修饰
101.CSS_常用文本属性_文本缩进
102.CSS_常用文本属性_文本对齐_水平
103.CSS_细说font-size
104.CSS_常用文本属性_行高_概念
105.CSS_常用文本属性_行高_注意事项
106.CSS_常用文本属性_文本对齐_垂直
107.CSS_常用文本属性_vertical-align
108.CSS_列表相关属性
109.CSS_边框相关属性
110.CSS_表格独有属性
111.CSS_背景相关属性
112.CSS_鼠标相关属性
113.CSS_常用长度单位
114.CSS_元素的显示模式
115.CSS_总结各元素的显示模式
116.CSS_修改元素的显示模式
117.CSS_盒子模型的组成部分
118.CSS_盒子的内容区_content
119.CSS_关于默认宽度
120.CSS_盒子的内边距_padding
121.CSS_盒子的边框_border
122.CSS_盒子的外面局_margin
123.CSS_margin的注意事项
124.CSS_margin塌陷问题
125.CSS_margin合并问题
126.CSS_处理内容溢出
127.CSS_隐藏元素的两种方式
128.CSS_样式的继承
129.CSS_元素的默认样式
130.CSS_布局小技巧
131.CSS_元素之间的空白问题
132.CSS_行内块的幽灵空白问题
133.CSS_浮动_简介
134.CSS_元素浮动后的特点
135.CSS_浮动的小练习
136.CSS_浮动后的影响
137.CSS_解决浮动产生的影响
138.CSS_浮动布局练习
139.CSS_相对定位
140.CSS_绝对定位
141.CSS_固定定位
142.CSS_粘性定位
143.CSS_定位的层级
144.CSS_定位的特殊应用
145.CSS_布局_版心
146.CSS_布局_常用类名
147.CSS_布局_重置默认样式
148.尚品汇_设计稿说明
149.尚品汇_顶部导航条
150.尚品汇_头部
151.尚品汇_主导航
152.尚品汇_内容区_侧边导航
153.尚品汇_内容区_侧边二级菜单
154.尚品汇_内容区_右侧尚品快报
155.尚品汇_内容区_右侧图标导航
156.尚品汇_秒杀
157.尚品汇_楼层_顶部
158.尚品汇_楼层_底部
159.尚品汇_页脚
160.H5_简介
161.H5_新增布局标签
162.H5_新增状态标签
163.H5_新增列表标签
164.H5_新增文本标签
165.H5_新增表单控件属性
166.H5_input新增type属性值
167.H5_新增视频标签
168.H5_新增音频标签
169.H5_新增全局属性
170.H5_兼容性处理
171.CSS3_简介
172.CSS3_新增长度单位
173.CSS3_新增盒子属性
174.CSS3_新增背景属性
175.CSS3_新增边框属性
176.CSS3_新增文本属性
177.CSS3_新增渐变
178.CSS3_web字体_字体图标
179.CSS3_2D变换
180.CSS3_3D变换
181.CSS3_过渡
182.CSS3_动画
183.CSS3_多列布局
184.CSS3_伸缩盒模型_简介
185.CSS3_伸缩盒模型_容器与项目
186.CSS3_伸缩盒模型_主轴方向
187.CSS3_伸缩盒模型_主轴换行方式
188.CSS3_伸缩盒模型_flex-flow
189.CSS3_伸缩盒模型_主轴对齐方式
190.CSS3_伸缩盒模型_侧轴对齐
191.CSS3_伸缩盒模型_水平垂直居中
192.CSS3_伸缩盒模型_基准长度
193.CSS3_伸缩盒模型_伸缩性
194.CSS3_伸缩盒模型_flex复合属性
195.CSS3_伸缩盒模型_排序与单独对齐
196.CSS3_伸缩盒模型_案例练习
197.CSS3_响应式布局_媒体查询
198.CSS3_响应式布局_常用阈值
199.BFC。