box-sizing的content-box使width/height仅含内容区，border-box则让width/height包含padding和border；margin和padding在两种模式下均有效且行为不变，但border-box会压缩内容区宽度。

position:relative元素仍占据原始文档流位置，仅视觉偏移；偏移基准是自身原位置，非父容器；top/left优先生效，不触发重排；影响后代absolute定位上下文。

盒子模型由content、padding、border、margin四层构成，浏览器渲染时天然存在；标准模型下width仅指content宽度，实际尺寸需加上padding和border；box-sizing:border-box可使width包含padding和border。

Flexbox容器需显式声明display:flex或inline-flex，否则flex-direction等属性无效；主轴由flex-direction决定，justify-content对齐主轴、align-items对齐交叉轴；flex缩写顺序为grow/shrink/basis；align-self仅对单个子...

本文详解如何通过组合CSSborder-radius与SVGstroke-linecap=‘butt’属性，解决内联SVG虚线背景在圆角容器中边缘被意外截断的问题，确保虚线完整、圆润地贴合容器轮廓。

父元素高度塌陷源于子元素设display:flex后脱离文档流且父容器无明确高度；应设min-height（如100vh、400px或fit-content）或height，确保html/body有height:100%，并检查overflow、position及子项flex基础尺寸。