footer文字居中首选text-align: center，兼容ie6且无需额外条件；flex仅在需垂直居中或复杂布局时必要，但要注意兼容性和文档流影响。
footer文字居中用text-align: center最直接
绝大多数静态页底部版权信息就一行纯文本，text-align: center加在footer或包裹文字的容器上，立刻生效，不依赖父容器高度、不触发BFC、兼容性到IE6都稳。
常见错误是给footer设了display: flex却忘了删掉text-align，结果两个居中逻辑打架；或者把text-align写在span这类行内元素上——它只对块级子元素起作用。
- 确保文字容器是块级（如
div、footer、p） - 不要在同个元素上同时用
text-align: center和justify-content: center - 如果文字被
float或position: absolute脱离文档流，text-align无效
需要垂直居中或响应式布局时才用display: flex
当底部要同时放logo、版权文字、备案号三栏，或要求文字在footer里上下左右都居中（比如全屏固定底栏），就得用flex。这时候text-align只管水平，不管垂直。
关键不是“能不能用”，而是“有没有必要用”：Flex会改变默认文档流，可能影响老项目中依赖height或line-height做垂直居中的逻辑；Safari 9以下对flex支持不全，若需兼容，得加-webkit-前缀或降级方案。
- 水平居中：用
justify-content: center - 垂直居中：必须设
align-items: center，且父容器要有明确高度（如min-height: 60px） - 避免对
body或html直接设display: flex，容易撑满全屏导致内容被截
margin: 0 auto在这里基本没用
margin: 0 auto只对**有宽度且是块级**的元素生效，而版权文字通常是span或未设宽的div，它不会自动变居中。有人试过给span加margin: 0 auto，发现完全没反应——因为span默认是行内元素，margin-left/right有效，但auto值会被忽略。
除非你把文字包进一个明确设了width和display: block的容器里，否则别碰margin: 0 auto。这招更适合居中一个固定宽的div，而不是一行文字。
- 想用
margin: 0 auto？先加display: block和width - 文字内容长度不确定时，设固定
width反而容易换行或溢出 - 移动端视口变化频繁，硬写
width比text-align更难维护
IE8及以下必须绕开flex，但text-align照常工作
如果项目还要支持IE8，display: flex直接不能用，连display: -ms-flexbox在IE10才开始支持。但text-align: center从IE5.5起就完全可靠，不用任何hack。
这时候若真需要垂直居中，只能靠line-height匹配height（单行适用），或用table-cell模拟（兼容性好但语义偏离）。别为了“看起来高级”强行上Flex，尤其当真实用户里还有0.3%用着IE8的政务内网系统。
- 查Can I Use确认目标环境的
flex支持率，别凭印象判断 -
text-align: center在所有场景下都比flex少一个兼容性风险点 - 真正卡住的往往不是技术选型，而是某个
footer被position: fixed后又套了transform，导致flex轴向错乱
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
