前端进阶：HTML+CSS基础知识点汇总记录

阶段性记录HTML5+CSS3核心知识点，梳理项目规范、基础标签、盒模型、圆角样式、Flex布局等核心内容，整理可复用的开发技巧与避坑要点。

经过一段时间的系统学习，已经完整掌握了HTML5+CSS3静态页面开发的基础知识点，本篇博客做一次阶段性知识梳理，汇总日常开发高频知识点、实用代码片段和常见避坑细节，方便后续查阅复用。

在项目规范层面，掌握了标准化的前端项目搭建流程，学会分层管理css、img资源文件，统一使用外部样式表管理全局样式，摒弃杂乱的代码书写习惯，养成规范化的开发思维，有效减少路径报错、样式冲突等基础问题。

在HTML基础层面，熟练运用文本标签完成页面排版，掌握图片、超链接的完整用法，能够根据场景选用不同图片格式、不同链接类型，同时清晰区分行内、块级、空元素的布局特性，可灵活通过display属性调整元素显示模式，适配各类排版需求。

在CSS样式层面，吃透盒模型核心原理，熟练掌握内外边距、边框的使用技巧，统一使用border-box规范尺寸计算，解决页面布局溢出问题；熟练运用border-radius实现各类圆角、圆形美化效果，能够独立制作精美卡片、按钮组件。

在核心布局层面，精通Flex弹性布局的完整用法，掌握容器配置、主轴侧轴对齐规则，能够快速实现元素居中、均分排列、自适应布局，独立完成导航栏、多列卡片、居中模块等常见页面布局，彻底摆脱传统浮动布局的局限。

同时整理了日常开发高频避坑细节：严格使用相对路径避免资源失效；统一全局样式重置清除默认边距；区分Flex主轴侧轴属性避免居中失效；根据场景合理选择图片格式优化页面性能。后续将继续深耕前端进阶知识，学习响应式布局与动态交互效果，持续更新学习博客。