因为max-width仅限制宽度上限，不控制位置，必须搭配margin: 0 auto才能居中；且需满足块级元素、有明确宽度约束、未脱离文档流三个条件，缺一不可。
为什么写了 max-width 却不居中
只加 max-width: 1200px，内容依然靠左——这不是 bug，是 CSS 规则本意如此。max-width 只限制最大宽度，不控制位置。浏览器默认把块级元素放在父容器最左侧，除非你明确告诉它“往中间放”。
- 必须搭配
margin: 0 auto才能触发水平居中逻辑 -
max-width必须作用在块级元素上（比如<div>、<code><main></main>），不能直接写在上生效（部分浏览器会因默认margin干扰） - 如果父容器用了
display: flex或display: grid，子元素的margin: 0 auto会被忽略——此时它已是 flex item / grid item，不再走常规块流外边距分配 - 目标元素是块级：默认
<div> 满足，但如果是 <code><span></span>或被设过display: inline，得先加display: block - 有明确宽度约束：可以是
width: 800px、width: 90%，或更推荐的max-width: 1200px; width: 100%（响应式友好） - 没脱离文档流：不能有
float、position: absolute或position: fixed，否则margin: 0 auto失效 - 用
<nav></nav>直接设width: 100%或width: 100vw，不加max-width - 用
<main></main>或独立<div class="container"> 包正文，加 <code>max-width: 1200px和margin: 0 auto - 记得重置
body { margin: 0 }，避免默认外边距干扰<nav></nav>的全宽表现 - 可选：
box-sizing: border-box防止padding溢出max-width
margin: 0 auto 生效的三个硬条件
缺一不可，少一个就白写：
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
导航栏全宽 + 内容区受限的 HTML 结构怎么写
常见需求：顶部导航铺满整个视口，正文区域却限制最大宽度并居中。关键在结构分离，不能把 max-width 套在 上。
示例最小可行结构：
<style>
body { margin: 0; }
nav { width: 100%; background: #333; color: white; padding: 1rem 0; }
main { max-width: 1200px; margin: 0 auto; padding: 2rem; box-sizing: border-box; }
</style><nav><ul><li>首页</li></ul></nav><main><h1>内容在此居中</h1></main>
表格里设 max-width 为啥没用
给 <table> 直接加 <code>style="max-width: 800px"，列还是撑开——这是表格默认布局行为决定的：table-layout: auto 下，浏览器优先按内容定列宽，max-width 只约束整体容器上限，不干预内部。
- 真正生效要三步：设
table-layout: fixed+<colgroup></colgroup>+ 显式列宽（如<col style="width: 200px">） -
<colgroup></colgroup>必须紧贴<table> 开始后、<code><thead> 前，顺序错就无效 <li>想某列弹性占剩余空间？可用 <code><col style="width: 1fr">（现代浏览器），或退化为width: auto配合min-width/max-width
实际项目里最容易被忽略的是：父容器是否无意中用了
flex 或 grid，导致子元素的 margin: 0 auto 完全失效——这时候得换思路，用 justify-content: center 或调整容器布局模式。
