用 border 设置实线边框最直接，需显式声明 solid（如 border: 1px solid #000），否则默认为 none；其伸缩性由 display 类型、box-sizing 和内容存在与否共同决定，空元素塌陷是主因。
用 border 设置实线边框是最直接的方式
HTML5 本身不提供“边框”语义，真正起作用的是 CSS 的 border 属性。想让边框是实线，必须显式写 solid，比如：border: 1px solid #000。漏掉 solid（例如只写 border: 1px #000）在多数浏览器里会退化为 none，边框直接消失——这是新手最常踩的坑。
实线边框默认就随内容伸缩：块级元素（如 div、p）宽度自适应内容+内边距+边框；行内元素（如 span）则紧贴文字，高度由行高和字体决定。不需要额外“隐藏法”来触发伸缩行为。
所谓“隐藏法”其实是误传，真正有用的是控制盒模型
有人提到“隐藏法”，可能混淆了 outline、box-shadow 或伪元素模拟边框的技巧，但这些都不是“让实线边框伸缩”的必要手段。真正影响伸缩表现的是 box-sizing：
-
box-sizing: content-box（默认）：width只算内容区，边框和内边距额外加出，容易撑破容器 -
box-sizing: border-box：width包含内容+内边距+边框，更符合“随内容自然伸缩”的直觉
推荐全局设置：* { box-sizing: border-box; }，避免布局意外溢出。
立即学习“前端免费学习笔记（深入）”；
