要使水平居中，需设置max-width或width配合margin: 0 auto；若父容器为flex或grid，则用justify-content: center；text-align: center仅影响其内部行内元素，对子块级元素无效；避免使用已废弃的标签。
引用段落（<blockquote></blockquote>）本身怎么居中
想让 <blockquote></blockquote> 这个块级元素在页面中水平居中，不是给它加 text-align: center，而是要控制它自身的定位。它默认是块级、宽度 100%，所以 margin: 0 auto 必须配合明确的 width 或 max-width 才生效。
常见错误现象：<blockquote style="margin: 0 auto;">…</blockquote> 完全没反应——因为没设宽度，浏览器按默认 100% 渲染，左右没剩余空间可分。
- 推荐写法：
<blockquote style="max-width: 600px; margin: 0 auto;"></blockquote> - 如果内容较短，用
width: fit-content+margin: 0 auto更灵活（注意 IE 不支持fit-content） - 父容器若为
display: flex或display: grid，margin: 0 auto会被忽略，此时改用justify-content: center作用于父容器
text-align: center 对 <blockquote></blockquote> 内容的影响
text-align: center 加在 <blockquote></blockquote> 上，只影响它内部的行内内容：比如文字、<cite></cite>、默认行内的 <img>。但它对子 <p></p>、<div> 或设置了 <code>display: block 的元素无效。
典型翻车现场：<blockquote style="text-align: center;"><p>这段文字不会居中</p></blockquote> ——因为 <p></p> 是块级，独占一行，text-align 不管它的位置。
- 正确做法：要么把
<p></p>改成display: inline-block，要么直接在子<p></p>上加text-align: center -
<cite></cite>默认行内，加了text-align: center就能居中；<footer></footer>或<small></small>同理 - 如果引用里有图片，
<img>默认行内，会随text-align一起居中；但加了display: block就失效了
用 Flexbox 居中 <blockquote></blockquote> 更稳的场景
当你要同时处理响应式宽度、垂直居中（比如放在 banner 区域）、或父容器布局已用 Flex 时，直接对父容器设 display: flex 比折腾 margin 更可靠。
示例：<section style="display: flex; justify-content: center; padding: 2rem;"><blockquote>引用内容</blockquote></section>
- 不用管
<blockquote></blockquote>自身宽高，flex 会自动居中其主轴位置 - 加
align-items: center可同时垂直居中（需父容器有高度，如min-height: 100vh） - 副作用：所有直系子元素的
float、vertical-align、传统margin对齐失效，<blockquote></blockquote>内部排版不受影响
为什么 <center></center> 标签不推荐
<center></center> 虽然至今仍被浏览器支持，但它在 HTML5 中已被废弃，语义上毫无价值，且行为不可预测：它会让整个子树内容强制居中，包括嵌套的块级元素，但无法与现代布局（如 flex/grid）共存，也难以覆盖或取消。
更关键的是，它绕过了 CSS 控制权，调试时你根本看不出居中逻辑在哪——是 <center></center>？是父 div 的 text-align？还是某个隐藏的 flex 规则？
- 替代方案永远优先用 CSS：
text-align: center（内容）、margin: 0 auto（定宽盒子）、flex（灵活容器） - 如果只是临时预览或邮件模板等受限环境，
<center></center>可用，但上线前务必替换
margin-top/margin-bottom），它会影响视觉“居中感”。哪怕 <blockquote></blockquote> 自身居中了，上下空白不一致也会让人觉得偏上或偏下——记得统一重置或微调 margin。
