多层背景图需用逗号分隔的单条background-image声明，如background-image: url(a.png), url(b.png)；各层background-position、background-size等属性须严格对应层级顺序，缺一或错位将导致渲染异常。
background-image怎么写多个值才生效
多层背景图不是靠多次写
覆盖实现的，必须用逗号分隔的值列表一次性声明。浏览器从左到右渲染，左边的图在最上层，右边的在底层。
错误写法：
—— 后者会完全覆盖前者
正确写法：
每层可独立配位置、尺寸、重复方式，用对应属性的逗号列表一一对应，比如
如果某层没指定
，默认是
，可能拉伸失真，尤其当容器宽高比和图片不一致时
各层background-size怎么配才不打架
必须和
层级严格对齐，缺一个或顺序错就会错位，底层图可能被裁掉或留白。
三层图就得写三个
值，例如：
用
的层会等比缩放填满容器，但可能裁边；
保证全显但可能留空；
是强制拉伸，慎用
如果某层只设宽度（如
），高度自动按原图比例推算，但前提是该层
已定义且能加载——否则整条声明可能被忽略
伪元素叠加背景图比多层background更可控吗
是的，当某层需要响应式隐藏、动画或单独 z-index 控制时，用
/
更稳。
多层
共享同一盒模型，无法单独显示/隐藏某一层
伪元素可以加
、
、
，而背景图本身不支持这些
注意：伪元素需设
和定位（如
），否则不渲染；父容器得是
性能上差别不大，但伪元素多了 DOM 节点，过度嵌套可能影响重排
IE11及以下不支持多层背景图怎么办
IE11 支持逗号分隔的
，但 IE10 及更早版本完全不认——直接忽略整条声明，回退到单层或纯色。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
下载
立即学习
“
前端免费学习笔记（深入）
”；
检测方法：用
写 CSS 特性查询做降级
务实做法：主背景用单图或渐变，装饰性图层用伪元素 + 条件注释或 JS 检测后插入 class
别依赖
配合多背景，它在 IE 全系不可用，且 Safari 旧版有渲染 bug
多层背景看着简单，实际容易栽在尺寸对齐、IE 兼容、以及“以为写了两行 background-image 就是两层”这种直觉错误上。最稳妥的是先写死一层，再加第二层并同步调所有逗号列表属性，边改边看渲染结果。
background-imagebackground-image: url(a.png); background-image: url(b.png);background-image: url(a.png), url(b.png);background-position: top left, center;background-sizeauto autobackground-sizebackground-imagebackground-sizebackground-size: 100% 100%, cover, contain;covercontain100% 100%100pxbackground-image::before::afterbackground-imageopacitytransformtransitioncontent: ""position: absoluterelativebackground-image@supports (background-image: url(a), url(b))background-blend-mode