HTML5中边框必须用CSS的border属性实现，因废除了border等样式属性；border需同时指定宽度、样式、颜色三值，如border:1px solid #333；表格需设border-collapse:collapse才能避免双线。
HTML5 本身没有设置边框的属性，边框必须用 CSS 的 border 实现 —— 这是新手最常卡住的第一步。
为什么 在 HTML5 里完全无效HTML5 废除了所有与样式相关的标签属性（比如 border、bgcolor、align）。你写 ![html5怎么设置边框实线_新手做实线边框常见误区【教程】]()
，浏览器可能“勉强显示”，但这是过时的 HTML4 行为，不合法，且在严格模式下会被忽略。
- 验证器会报错：
Attribute border is not allowed on element img
- 现代框架（如 React/Vue）中这类属性直接被过滤掉
- 即使渲染出来，也无法控制线型（实线/虚线）、颜色、圆角等细节
border 的三个必要参数缺一不可
CSS 的 border 是简写属性，必须同时指定宽度、样式、颜色，否则实线不会出现。只写 border: 1px solid; 或 border: #000; 都无效。
div {
border: 1px solid #333; /* ✅ 正确：宽 + 样式 + 颜色 */
border: 2px solid; /* ❌ 错误：缺颜色，整条边框消失 */
border: #666; /* ❌ 错误：缺宽和样式，不生效 */
}
-
solid 是唯一表示“实线”的关键字；dashed、dotted、double 都不是
- 宽度推荐用
px（如 1px），避免用 thin/medium 等相对值，它们在不同浏览器中表现不一致
- 颜色可以是十六进制（
#000）、rgb（rgb(0,0,0)）或关键字（black），但不能留空
表格边框塌陷问题：为什么 border-collapse 很关键
给 加 border 后，经常看到双线、缝隙或粗细不均 —— 这是因为表格默认使用分离边框模型（border-collapse: separate），单元格各自画边框。立即学习“前端免费学习笔记（深入）”；
- 加
border-collapse: collapse; 才能让相邻边框合并成一条实线
- 必须作用在
元素上，而不是 或
- 如果还想要内边距，用
padding 控制单元格内容间距，别依赖边框间隙 table {
border: 1px solid #ccc;
border-collapse: collapse; /* ✅ 关键一步 */
}
td, th {
border: 1px solid #ccc; /* ✅ 单元格边框也设 solid，配合 collapse 才整齐 */
padding: 8px;
}真正容易被忽略的是：边框是否生效，往往取决于元素是否有内容或高度/宽度 —— 空 默认高为 0，border 画出来了也看不见；这时候得加 min-height、padding 或内容占位。
HTML5 废除了所有与样式相关的标签属性（比如 CSS 的 给 立即学习“前端免费学习笔记（深入）”； 真正容易被忽略的是：边框是否生效，往往取决于元素是否有内容或高度/宽度 —— 空 border、bgcolor、align）。你写 ，浏览器可能“勉强显示”，但这是过时的 HTML4 行为，不合法，且在严格模式下会被忽略。
Attribute border is not allowed on element img
border 的三个必要参数缺一不可border 是简写属性，必须同时指定宽度、样式、颜色，否则实线不会出现。只写 border: 1px solid; 或 border: #000; 都无效。div {
border: 1px solid #333; /* ✅ 正确：宽 + 样式 + 颜色 */
border: 2px solid; /* ❌ 错误：缺颜色，整条边框消失 */
border: #666; /* ❌ 错误：缺宽和样式，不生效 */
}
solid 是唯一表示“实线”的关键字；dashed、dotted、double 都不是px（如 1px），避免用 thin/medium 等相对值，它们在不同浏览器中表现不一致#000）、rgb（rgb(0,0,0)）或关键字（black），但不能留空表格边框塌陷问题：为什么
border-collapse 很关键 加
border 后，经常看到双线、缝隙或粗细不均 —— 这是因为表格默认使用分离边框模型（border-collapse: separate），单元格各自画边框。
border-collapse: collapse; 才能让相邻边框合并成一条实线 元素上，而不是
或
padding 控制单元格内容间距，别依赖边框间隙table {
border: 1px solid #ccc;
border-collapse: collapse; /* ✅ 关键一步 */
}
td, th {
border: 1px solid #ccc; /* ✅ 单元格边框也设 solid，配合 collapse 才整齐 */
padding: 8px;
}border 画出来了也看不见；这时候得加 min-height、padding 或内容占位。
