background-attachment：fixed 实现了视差滚动的逻辑理解

background-attachment：fixed 实现了视差滚动

<section style="height: 300px;width:500px;background: url('https://codeqd.com/zb_users/upload/2023/09/0034034859692813_b.jpg') fixed no-repeat;">IMG1</section>

使用浏览器窗口作为背景图的绘制区域，因此背景图相对于背景图是固定的browser、tag 填充的区域是可见区域，只是图像的一部分。当可见区域移动（即旋转）时，它将移动到图像的相应部分，从而创建旋转视差效果。
从UI上的理解就是将背景图片放在板上并固定好，在上面贴上遮罩，然后在遮罩上开一个洞。无论洞在哪里，您都可以看到图像的一部分。

简单易懂的滚动和local

• 后台连接：localfixed与浏览器相关，local则与自身相关。当子元素滚动时，背景也会移动

<div style="height: 300px;width:500px;overflow: auto;background: url('https://codeqd.com/zb_users/upload/2023/09/0034034859692813_b.jpg') local no-repeat;">
        <section style="height: 300px;width:500px;">IMG2</section>
        <section style="height: 300px;width:500px;">IMG3</section>
</div>

• background-bounding：滚动是最常见的方式，背景视图和内容是固定的。

ps：加粗的背景好像不对，一定是背景图。