noshade属性在HTML5中已被彻底移除，现代浏览器忽略它，必须用CSS替代：设置height、border:none和background-color才能可靠实现纯色分割线。
align 属性只在老式 HTML 中生效，现代浏览器已忽略其行为
HTML 的 align 属性用于控制 <hr> 的水平对齐方式（left、center、right），但它属于已被废弃的呈现属性。现代浏览器（Chrome、Firefox、Safari、Edge）基本不响应 align 值，即使写上 <hr align="left">，实际仍按默认居中渲染。
原因很简单：该属性没有被纳入 CSS 规范，也没有对应的 CSS 替代机制（比如 text-align 对 <hr> 无效）。它仅在 IE6–IE8 等极旧环境中可能残留效果，但不可靠。
真正可控的对齐方式必须用 CSS：
-
<hr style="margin-left: 0; margin-right: auto;">实现左对齐（需配合width或max-width） -
<hr style="margin: 0 auto;">显式居中（前提是块级、有宽度限制） -
<hr style="margin-left: auto; margin-right: 0;">右对齐
noshade 是 HTML4 的遗留属性，HTML5 完全不支持
noshade 属性本意是关闭 <hr> 的 3D 阴影效果，使其显示为纯色实线。它的写法是布尔属性，可简写为 <hr noshade> 或完整写成 <hr noshade="noshade">。
但问题在于：
- HTML5 标准中已彻底移除
noshade，任何验证器都会报错 - 现代浏览器虽仍能解析该属性（出于兼容性兜底），但实际渲染逻辑早已由 CSS 控制
- 不同浏览器对
noshade的“纯色”定义不一致（比如颜色深浅、是否带边框），导致视觉不可控
正确做法是用 CSS 覆盖默认样式：
<hr style="height: 2px; border: none; background-color: #ccc;">
其中 border: none 是关键——默认 <hr> 实际是通过 border-bottom 模拟的阴影线，清掉边框再设背景色，才能得到稳定、跨浏览器的实线效果。
为什么不能混用 align + noshade + width + size
这些属性都属于 HTML4 的内联呈现控制，它们之间存在隐式优先级冲突，且浏览器解析顺序不统一。例如：
-
<hr width="50%" size="3" align="left" noshade>在 Firefox 中可能忽略align，但保留width和noshade效果 - 同一段代码在 Safari 中可能把
size当作height，而在 Chrome 中被border覆盖失效 -
width若用像素值（如width="200"），部分浏览器会当作 CSSwidth解析；若用百分比（width="80%"），又可能受父容器display类型影响而失效
这种不确定性正是 W3C 废弃它们的根本原因——语义与样式不该耦合在标签里。
替代方案必须用 CSS，且要处理 border 与 background 的关系
现代写法不是“去掉旧属性”，而是主动重置所有默认样式：
- 默认
<hr>在多数浏览器中等价于border-bottom: 1px solid #ccc，不是纯背景色 - 只设
height不够，必须同时设border: none，否则边框会叠加在背景上 - 若要颜色随主题变化，推荐用
background-color: currentColor，而非硬编码十六进制值 - 响应式场景下，
width应用max-width+margin组合，而非直接写width属性
一个健壮的示例：
<hr style="height: 1px; border: none; background-color: #999; margin: 1.5em auto; max-width: 600px;">
这个写法在所有现代浏览器中行为一致，且不会因 HTML 版本或 DOCTYPE 变化而失效。
真正麻烦的从来不是怎么写一行分隔线，而是旧项目里那些散落在各处的 align 和 noshade——它们看起来还在工作，其实随时可能在某个浏览器更新后突然崩坏。
