text-align仅控制块级元素内行内内容的水平对齐，不适用于垂直居中；常用值为left、right、center、justify；对浮动元素无效，表格单元格需单独设置，非父容器继承。
用 text-align 控制段落和块级元素的水平对齐
HTML 本身没有直接设置文本对齐的属性，必须靠 CSS 的 text-align。它只对块级元素（比如 <p>、<div>、<h1>）生效，对纯文本或行内元素（如 <span>）设了也没用——除非那个 <span> 被设成了 display: block。
常见写法是加在 <style> 标签里，或者写进外部 CSS 文件：
<style>
p { text-align: center; }
.intro { text-align: right; }
</style>
-
left、right、center是最常用值；justify可实现两端对齐，但中文效果常不理想（字距拉得太开） - 别在
<div>上乱设text-align: center后又指望里面浮动元素也居中——浮动会脱离文档流，text-align拿它没辙 - 如果整个页面文字都偏左，但某一段想居中，优先给那段加 class，而不是改全局
p样式，避免副作用
内联样式也能快速试效果，但别长期这么干
临时调试时，可以直接在标签上加 style 属性：
<p style="text-align: center;">这段文字会居中</p>
这确实快，但问题明显：
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 样式和结构混在一起，后期改对齐方式得挨个翻 HTML，没法批量调整
- 如果多个地方都要居中，复制粘贴容易漏改，还可能写错大小写（
Center不合法，必须小写center） - 浏览器开发者工具里看到的
style属性权重最高，会覆盖外部 CSS，干扰调试判断
表格里的文字对齐要单独处理
表格（<table>）是个特例：text-align 对 <td> 和 <th> 有效，但老代码里有人还在用已废弃的 align 属性（如 <td align="right">）。现在必须用 CSS：
<style>
td, th { text-align: left; }
td.price { text-align: right; }
</style>
- 别只给
<table>设text-align，它不会自动继承到单元格——CSS 中text-align不继承自父容器的块级元素，但会继承自<body>或更上层的样式规则 - 数字列（如价格、数量）习惯右对齐，方便小数点对齐；标题栏常用
center；常规描述文字保持left
垂直居中不是 text-align 管的事
新手常误以为 text-align: center 能让文字上下居中，结果发现没反应。这是根本性误解：text-align 只管水平方向（左/中/右），垂直方向得换方法：
- 单行文本：给容器加
line-height等于容器高度（前提是高度固定） - 多行文本或任意内容：用 Flexbox，比如
display: flex; align-items: center; justify-content: center; - 绝对定位 +
transform: translate(-50%, -50%)也行，但需要已知宽高或额外处理
把 text-align 当万能居中工具，是初学 CSS 最容易卡住的地方。
