Bootstrap表格内容横向溢出时，table-responsive 容器为什么没生效？检查 table-responsive 的直接父元素——避免它有 overflow: hidden、overflow: clip 或 display: flex 且未设 flex-shrink: 0确保 table-responsive 是块级元素（默认就是），且没有被 CSS Grid / Flex 容器意

display: flow-root 是解决浮动导致父容器高度塌陷最干净的现代方案，它创建BFC使父容器正确包裹浮动子元素，无副作用且兼容主流浏览器。立即学习“前端免费学习笔记（深入）”；}它不会改变子元素的布局模式，浮动仍生效，只是父容器“看得见”它们了若需兼容 IE 或极老安卓 WebView，才考虑回退到 ::after 清除浮动（但绝大多数项目已无需）伪元素清除浮动仍可用，但要注意细节当必

需确保父容器有可计算高度（如100vh）、子元素未设固定height、IE11中优先用flex:1而非align-items:stretch。子元素写了height: 200px？} /* 设了height → 不再stretch */flex-direction: column 下，子项撑高需要 align-self 或 min-height 配合竖排布局时，主轴变垂直，交叉轴变水平——此时al

伪类（如:hover）里写最常用，但默认状态、禁用态（:disabled）、聚焦态（:focus）也可以单独设行内样式（style="cursor: move;"）能覆盖外部CSS，适合临时调试，但别长期这么用如果用了pointer-events: none，再设cursor也没用——鼠标根本“感知不到”这个元素常见cursor值的实际行为差异pointer和hand不是一回事：hand不是标准值

bootstrap 默认会给 .disabled 按钮或带 disabled 属性的 <button> 设置 cursor: not-allowed，但实际中常发现鼠标还是箭头——根本原因是：原生 disabled 属性会强制禁用 pointer events，css 的 cursor 在多数浏览器里被忽略（尤其 chrome/firefox 对原生 disabled 元素的 cursor 有策略