text-align: center 未生效最常见原因是作用对象错误：它只对块级元素内部的行内内容有效，不能使块级元素自身居中；给行内元素直接设置无效，需设在其父块级容器上。
text-align: center 为什么没生效
最常见的原因是作用对象错了：text-align 只对块级元素（如 div、p）内部的行内内容起作用，不是让 div 自身居中。如果你给一个没设宽的 div 加了 text-align: center，它自己会撑满父容器，里面的文字才居中——这没问题；但若误以为这是让 div 居中，就会困惑。
容易踩的坑：
- 给行内元素（如
span）直接设text-align: center，无效——得设在它的父块级容器上 - 父元素用了
float或position: absolute，可能破坏文档流，导致text-align表现异常 - CSS 优先级被其他样式覆盖，比如后面定义的
text-align: left覆盖了前面的center - 拼写错误：写成
text-algin或tex-align
div 内文本右对齐的正确写法
右对齐和居中一样，靠 text-align: right 实现，但要注意语义和场景：
- 适用于标题右侧署名、时间戳、按钮组右对齐等常规布局
- 如果整个页面右侧需要留白，别只靠
text-align，它不改变元素位置，只是内容排列 - 和
direction: rtl混用时要小心，text-align: right在 RTL 环境下行为可能反直觉 - 响应式中，小屏下右对齐文字可能被截断，建议配合
overflow: hidden或white-space: nowrap控制
示例：<div style="text-align: right;">最后更新：2026-06-15</div>
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
align 属性还在用？赶紧停手
div 的 align 属性（如 <div align="center">）在 HTML5 中已彻底废弃，所有现代浏览器虽仍兼容，但会触发控制台警告，且在严格模式（XHTML / HTML5 validator）下直接报错。
<p>为什么必须换 CSS：</p>
<ul>
<li>
<code>align 是内联表现层逻辑，违反 HTML 语义与样式分离原则
left/right/center/justify，缺少 start/end 等逻辑方向支持align 属性完全失效，而 text-align 仍可控制内部文本text-align 对图片和按钮也有效吗
有效，但有前提：这些元素必须是行内级或行内块级。默认 img 是行内元素，button 是行内块级，所以 text-align 能控制它们在 div 中的水平位置。
- 如果图片没居中，检查是否被设了
display: block—— 这会让它脱离行内流，text-align失效 - 想让多个按钮右对齐，直接给父
div设text-align: right即可，不用每个按钮都加样式 - 注意
vertical-align会影响行内元素的基线对齐，和text-align配合使用时容易出现视觉偏移
真正复杂的是垂直居中——text-align 不管这事，得用 line-height、flex 或 grid，那是另一个问题了。
