通过移除 `
` 元素默认下边距并统一控制 `
- ` 行高，可有效压缩嵌套段落的 `
- ` 项垂直间距，避免过大的空白区域。
在 HTML 中，
- 的 compact 属性早已被废弃（HTML5 不支持），无法实现预期的紧凑布局。真正影响列表项垂直密度的，往往是
- 内含
时），推荐以下组合方案：
✅ 核心策略：
- 移除
的底部外边距（margin-bottom: 0），消除段落间冗余空白；
- 显式设置
- 的 line-height（如 18px 或 1.2），确保行高可控且一致；
- 弃用已废弃的 compact 属性，改用现代 CSS 控制；
- 如需进一步微调，可对
- 设置 margin-bottom: 0 或 padding-bottom: 0。
? 示例优化代码：
-
123:
Lorem
-
456
ipsum dolor sit
-
789
amet consecituir or something like that I don't know I don't care
? 进阶建议：
- 避免内联样式，推荐将规则提取至 CSS 类中，例如：
.compact-list { padding-left: 25px; line-height: 1.2; } .compact-list p { margin-bottom: 0; } - 若使用 Bootstrap（如示例中引入的 v5.x），注意其 .p-* 工具类（如 mb-0）可直接替代内联 margin-bottom: 0；
- 检查是否受父容器 font-size 影响——line-height 若设为无单位数值（如 1.2），会基于当前字体大小计算，更具备响应性。
⚠️ 注意事项：
不要依赖 compact 属性或仅调整- 的 margin/padding —— 它们无法解决
自带的块级外边距问题。真正的紧凑感来自对子元素（特别是
）的精准重置。
- 移除
标签自身的默认外边距（尤其是 margin-bottom）以及行高（line-height）继承关系。
要实现更紧凑的
- 列表（尤其当每个
- 内含
