超链接加边框必须用 border 而非 outline；需完整声明宽度、样式（如 solid）、颜色；行内元素 a 需设 display: inline-block 或 block 才能使 padding 和 margin 生效；居中须通过父容器控制，不可直接对 a 用 margin: auto。
超链接加边框必须用 CSS 的 border，不是 outline
点击链接时冒出来的蓝圈是 outline，它只在聚焦时出现、不占布局空间、不能设圆角，和你想要的“可见边框”完全不是一回事。真要加边框，得明确写 border: 1px solid #000;——宽度、样式（如 solid）、颜色三者缺一不可。漏掉 solid 或颜色，浏览器默认 border-style: none，边框就直接消失。
常见错误：a { border: 1px; }（没样式）或 a { border: solid #666; }（没宽度），都无效。另外，a 默认是行内元素，加边框后若想让上下 padding 生效，得先加 display: inline-block; 或 display: block;。
a 标签居中要用父容器控制，不是给 a 自己设 margin: auto
a 是行内元素，margin: 0 auto 对它完全不起作用。正确做法是把 a 放进一个块级容器里，然后：
- 水平居中：给父容器加
text-align: center; - 水平+垂直居中（比如整个页面居中）：父容器设
display: flex; justify-content: center; align-items: center; height: 100vh; - 定宽按钮式居中：给
a加display: block;和width，再配margin: 0 auto;
别试图对 a 直接用 margin-left: auto——它没用，还容易让人误以为 CSS 写错了。
立即学习“前端免费学习笔记（深入）”；
按钮式超链接的边框+圆角+悬停效果怎么写
把 a 当按钮用时，建议统一加这些基础样式：
- 强制块级行为：
display: inline-block;（保留行内流位置，又支持宽高/内外边距） - 边框与圆角：
border: 2px solid #007bff; border-radius: 4px; - 内边距撑开可点区域：
padding: 8px 16px; - 悬停反馈：
a:hover { background-color: #007bff; color: white; }（注意：hover 时若改了背景色，记得同步调文字色）
如果希望边框在 hover 时变化（比如变粗或换色），直接改 border 即可，但避免同时动画 border-width 和 border-color——部分旧浏览器渲染卡顿。更稳的做法是只动 border-color 或用 box-shadow 模拟边框增强。
表格里超链接居中加边框容易踩哪些坑
表格单元格（td / th）本身有默认 padding，直接在 a 上加 border 会显得偏移、不对齐。更糟的是，如果表格用了 border-collapse: collapse，而你又在 td 上加了 border，a 的边框可能被盖住或错位。
- 优先给
td设边框，a只负责内容样式；需要a独立边框时，给td加padding: 0;再让a填满 - 居中用
td { text-align: center; vertical-align: middle; }，别依赖a自身对齐 - 禁用浏览器默认下划线：
a { text-decoration: none; }，否则边框和下划线共存会很乱
最常被忽略的一点：深色模式下，硬编码颜色（如 #000）可能对比度不足。建议用 currentColor 或 CSS 变量配合 @media (prefers-color-scheme: dark) 微调边框色。
