给video标签加实线边框的正确写法是用CSS设置border: 2px solid #000；因video无原生border属性，直接写border="1"无效，推荐用外层div容器包裹并设边框更可控。
video 标签加实线边框的正确写法
HTML5 的 本身不提供边框属性，必须用 CSS 控制。直接在标签里写 border="1" 是无效的（那是旧版 HTML 的 table 做法），现代浏览器会忽略。
最稳妥的方式是给 元素设置 border CSS 属性：
video {
border: 2px solid #000;
}注意：如果视频有 controls，边框会包住整个控件区域；如果还加了 poster 或自定义 UI，建议用外层容器控制边框更可控。
为什么有时边框不显示？常见原因
不是代码写错，而是被其他样式覆盖或盒模型干扰：
立即学习“前端免费学习笔记（深入）”；
-
outline: none或outline: 0不影响 border，但有人误以为它能“去边框”——其实它只去掉焦点环 - 父容器设置了
overflow: hidden，而边框超出容器范围被裁剪 - 视频元素默认是 inline 级别，可能受行高、基线对齐影响，导致视觉上“边框偏移”，加
display: block或vertical-align: top可修复 - 某些浏览器（如 Safari）对
的 shadow DOM 内部控件有默认内边距，border 看起来“不贴合”，此时建议用 wrapper 容器套一层再设边框
用 wrapper 容器加边框更可靠
当需要精确控制边框位置、避免和 controls 冲突，或要统一处理多个媒体元素时，推荐封装一层 对应 CSS： 这样边框完全由容器承载，video 自身可专注内容渲染，也方便后续加阴影、圆角等效果。 不是。“实线”对应的是 只要写成 边框是否“看起来实”，还取决于像素比和缩放——高清屏下 1px 可能发虚，这时可考虑用 .video-wrapper {
border: 3px solid #333;
display: inline-block; /* 防止换行撑宽 */
}
video {
display: block; /* 消除底部空白 */
}border-style 有哪些可选值？solid 是唯一实线吗
border-style: solid，但它只是 border-style 的一个取值。其他常见值包括：
dashed：虚线dotted：点线double：双线groove / ridge：3D 凹凸效果（依赖 color 和 background，实际很少用于 video）border: 2px solid #000，就一定是清晰连续的实线。别用 border-style: inset 或 outset，它们在 video 上渲染不可靠，且语义不符。border: 0.5px solid #000（部分浏览器支持）或改用 box-shadow: 0 0 0 1px #000 模拟。
