HTML5本身不定义双线边框，需用CSS的border-style: double实现；要求明确设置border-width（≥2px）和颜色，不支持border-radius，内联样式须写全border简写。
HTML5 本身没有专门定义双线边框的属性——border 样式由 CSS 控制，HTML 的 style 属性或外部样式表才是实际生效的地方。所谓“HTML5 定义”，其实是误传；真正起作用的是 CSS 的 border-style 值。
用 border-style: double 实现双线边框
这是最直接、标准的方式。双线由两条等宽实线 + 中间等宽空白构成，总宽度 = 3 × 单线宽度（例如 border-width: 2px 时，整体占 6px 高度/宽度）。
-
double必须配合明确的border-width使用，否则可能不渲染（尤其border-width: thin等关键字在部分浏览器中不支持double） - 只支持四边统一设置，不能单独对某一边设为
double同时其他边用不同样式（除非分别写border-top-style等） - 不支持圆角衔接：
border-radius与double共存时，双线会在圆角处断裂或渲染异常（Chrome 和 Firefox 表现不一致）
div {
border: 3px double #007bff;
}
HTML style 属性内联写法
虽然不推荐长期使用内联样式，但快速调试或单次使用时可行。注意引号嵌套和分号结尾。
- 必须写全
border简写：宽度 + 样式 + 颜色，缺一不可（仅写double或只写border-style不生效） - 颜色不能省略，即使想用默认黑色也要显式写
#000或black - 不要在
style中写!important—— HTML 内联样式本身优先级已高于大多数 CSS 规则
内容
为什么不用
outline 模拟双线？
有人尝试用两个 outline + border 组合，但都属于 hack，问题明显：
立即学习“前端免费学习笔记（深入）”；
-
-
outline不占据布局空间，且无法设置左右/上下独立样式，outline-style: double实际多数浏览器不支持（仅 Safari 旧版部分识别） -
伪元素（如
::before）画第二条线虽可行，但增加 DOM 复杂度，且焦点/可访问性行为易出错
真正稳定可靠的双线边框，只有 border-style: double 这一条路。关键点在于：宽度要够（建议 ≥ 2px），颜色要明确定义，同时避开 border-radius 场景——如果设计上必须圆角+双线，得换思路，比如用 box-shadow 模拟外线，再用 border 画内线。
