border-style: dashed 要生效必须配 border-width，否则边框不显示；因样式只定义画法，宽度才提供绘制空间，未声明或为0时虚线失效，推荐用 border: 2px dashed #999 一步到位。
border-style: dashed 要生效，必须配 border-width，否则边框根本不会显示——这不是 bug，是 CSS 规范要求：样式（style）只定义“怎么画”，宽度（width）才决定“有没有空间可画”。
为什么写了 border-style: dashed 却看不到虚线
最常见原因就是边框宽度为 0 或未声明。border-style 本身不带宽度，默认值是 medium（约 3px），但部分框架或重置样式会把 border-width 设为 0，导致 dashed 形同虚设。
- 检查 computed 样式里
border-top-width是否为0px - 避免只写
border-style: dashed; color: #999;—— 缺少宽度，等于没写 - 推荐用简写：例如
border: 2px dashed #999;，一步到位，不易遗漏 - 若只设单边（如上边），必须同时写
border-top-width和border-top-style，不能只靠border-top-style
border: 1px dashed 在高清屏/缩放下变成实线
这是渲染限制，不是代码写错了。浏览器对虚线的 dash/gap 长度有物理像素下限（通常 ≥1px），当 border-width: 1px 遇上 Retina 屏（DPR=2）或页面缩放（zoom: 150%），逻辑像素被压缩，dash 和 gap 都被取整为 1 设备像素，视觉上就糊成实线。
- 直接解法：把宽度提到
2px或更高，例如border: 2px dashed #ccc; - 慎用
1px dashed做分隔线，尤其在卡片、表格、表单区域这类高频场景 - 若设计强制要求细线节奏（比如 1px dash + 3px gap），必须放弃原生
dashed，改用border-image或repeating-linear-gradient模拟
表格中 border-style: dashed 显示不连贯
表格默认使用 border-collapse: separate，单元格之间存在 border-spacing，导致虚线被截断、错位或中间留白，看起来像“断掉的虚线”。
- 统一加
border-collapse: collapse;，让相邻边框合并，虚线才能连续延伸 - 如果只想要外边框虚线、内部实线，可以分开控制：
table { border: 2px dashed #999; }+td, th { border: 1px solid #eee; } - 避免在
th或td上单独设border-style: dashed又不处理border-collapse，容易出现不可预测的间隙
想精确控制虚线长度和间隔怎么办
border-style: dashed 不接受 dash 长度、gap 大小或偏移量参数——各浏览器按自身算法生成（Chrome 倾向等长，Firefox 可能略有差异），所以它不适合需要节奏一致的设计需求。
立即学习“前端免费学习笔记（深入）”；
- 用
border-image+repeating-linear-gradient是目前最可控的方案，例如：border: 4px solid;<br>border-image: repeating-linear-gradient(to right, #000 0 2px, transparent 2px 6px) 1;
- 该方案缩放稳定、DPR 适配好，且可精确到像素级控制
- 注意
border-image-slice: 1必须显式设置，否则渐变可能被裁剪失效 - 不要指望
border-style: dashed回退——一旦用了border-image，原生样式就完全被覆盖
dashed 的渲染边界在哪里。 
