标签：CSS3 Web 鲜儿 前端 案例 HTML 小兔 选择器 CSS
前端入门基础教程：Web前端HTML5+CSS3+移动Web
配套资料：链接：https://pan.baidu.com/s/1Wvi-__pNUUGZcLjlYm5zsA
提取码：3ola
适用人群：
1.对前端开发感兴趣的在校生及应届毕业生。
2.对目前职业有进一步提升要求，希望从事前端行业高薪工作的在职人员。
3.对前端行业感兴趣的相关人员。
教程内容：
一、HTML 01-认知
1. HTML的基本语法
2. HTML的排版标签
3. 绝对路径和相对路径
4. HTML的多媒体标签
5. HTML的链接标签
6. 案例：招聘案例、今日热词案例
二、HTML 02-基础
1. HTML的列表标签
2. HTML的表格标签
3. HTML的表单系列标签
4. HTML的语义化布局标签
5. HTML的字符实体
6.案例：学生信息表格案例、会员注册表单案例
三、CSS 01-基础选择器+字体文本样式
1. CSS的引入方式
2. CSS的标签、类、ID、通配符选择器
3. CSS的字体相关样式
4. CSS的文本相关样式
5. CSS的水平居中技巧
6. Chrome调试工具的使用
7. 案例：新闻网页案例、卡片居中案例
四、CSS 02-选择器进阶+背景相关属性+元素显示模式+三大特性
1. CSS的后代、子代、并集、交集选择器
2. emmet基本语法
3. hover伪类选择器
4. CSS的背景相关属性
5. 三种常见的元素显示模式
6. CSS三大特性：继承性
7. CSS三大特性：层叠性
8. 案例：五彩导航案例
五、CSS 03-盒子模型
1. CSS三大特性：优先级
2. CSS的权重叠加计算方法
3. 盒子模型的组成部分
4. 盒子模型的边框、内边距、外边距的作用和代码实现
5. 外边距折叠现象
6. 案例：新浪导航案例、网页新闻列表案例
六、CSS 04-浮动
1. CSS的结构伪类选择器
2. 伪元素的基本使用
3. 标准流的排布规则
4. 浮动的特点和使用
5. 清除浮动的常见方法
6. 案例：小米布局案例、网页导航案例
七、CSS 05-定位+装饰
1. 定位的特点和使用
2. 垂直对齐方式
3. 边框圆角完成正圆和胶囊按钮效果
4. 元素显示隐藏切换效果
5. CSS完成三角形效果
6. CSS的链接伪类选择器
7. CSS的焦点伪类选择器
8. CSS的属性选择器
9. 案例：卡片模块hot图标案例、导航二维码居中定位案例
八、小兔鲜 01-项目前置样式+项目搭建
1. 精灵图的使用
2. CSS的背景图片大小属性
3. 文字和文本阴影效果
4. SEO三大标签
5. 项目结构搭建和基础公共样式
6. 实战：实现 「小兔鲜儿项目」 header模块开发
九、小兔鲜02-header+footer+主体内容
1. 实战：实现 「小兔鲜儿项目」 header模块开发
2. 实战：实现 「小兔鲜儿项目」 网站入口xtx-entry模块开发
3. 实战：实现 「小兔鲜儿项目」 新鲜好物面板xtx-new-goods模块开发
十、CSS3高级
1. 平面转换
2. 空间转换
3. 动画
十一、 Flex布局模型
1. Flex布局模型的使用
2. 项目：小兔鲜儿-移动端
3. 项目：小兔鲜儿-PC端
十二、移动端网页适配方案
1. Rem基本使用
2. Rem + 媒体查询适配
3. Rem + flexible适配
4. Rem适配原理
5. 项目：游乐园
6. vw/vh基本使用
7. vw/vh适配原理
8. 项目：B站
十三、响应式
1. 媒体查询基本使用
2. 媒体查询实现响应式网页效果
3. Bootstrap框架基本使用
4. Bootstrap框架栅格系统
5. 项目：腾讯全端
标签：CSS3,Web,鲜儿,前端,案例,HTML,小兔,选择器,CSS 来源： https://blog.csdn.net/Aa112233aA1/article/details/118895642
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。