background-image 不显示，九成是路径写错了

写完一个活动页，本地打开背景图好好的，传到服务器上变成一片空白。控制台没报错，Network 面板里图片状态是404。问题不在CSS语法，在路径。

background-image 里的 url() 是相对CSS文件本身解析的，不是相对HTML页面。样式写在 css/main.css，图片放在 img/banner.jpg，正确写法是 url(../img/banner.jpg)。很多人按HTML的位置写成 url(img/banner.jpg)，本地用编辑器预览能过，上线就断。

几个容易漏的细节

路径里有空格要加引号，否则整条声明被丢弃。文件名大小写敏感，服务器是Linux时 Banner.JPG 和 banner.jpg 是两个文件。带中文的路径要确认编码，老服务器上常见乱码导致404。

尺寸和裁切

background-size 只写 cover，图片按比例铺满，超出部分裁掉；写 100% 100% 会拉伸变形。要做等比且完整显示用 contain，四周留白。background-position 配 center 是常规组合，配合 background-repeat: no-repeat 才不会平铺。

.banner { background-image: url(../img/banner.jpg); background-size: cover; background-position: center top; background-repeat: no-repeat; }

容器没有高度

div 里只有绝对定位或浮动子元素时，高度会塌成0，背景图自然看不见。给它一个 min-height，或者用 aspect-ratio 撑开。这是新手最常卡住的地方，图明明加载了，就是不显示。

排查顺序固定下来：先看 Network 有没有404，再看容器高度，语法排在这两项之后。八成的问题在前两步就解决了。