直接写CSS布局易失控因布局规则与组件样式混杂，导致修改局部影响全局；BEM+布局原子类（如.l-stack、.l-grid-2）将布局行为抽离为功能型类，组件样式禁用布局属性，响应式在布局类内统一处理，实现职责分离。

空格（ ）属于文本内容，用于强制保留不可断行空格；margin属于CSS布局属性，用于控制元素间距离。混用会导致语义混乱与布局错乱，应严格区分内容与样式。

 是HTML中表示不换行空格的实体，强制保留不可折行的空白字符，用于解决表格空值、按钮右隙、英文缩写防断行等特定排版需求，而非美化代码或替代CSS布局。

用flex布局配合align-items可解决标题和图文错位问题：先给共同父容器设display:flex，再用align-items:center等值控制垂直对齐，同时重置标题margin和line-height以确保一致性。

盒模型是CSS布局的起点和底层语言，必须优先掌握；它解释了元素实际尺寸计算、margin塌陷、居中失效等常见问题，启用box-sizing:border-box可大幅降低出错率。

清除浮动影响的核心方案是clear属性和clearfix伪元素，现代推荐使用display:flow-root触发BFC，简洁无副作用；旧项目可选clearfix，避免用clear空标签。