测试环境: macOS 11.13.3, Chrome 64
p161,关于滚动提示的 css 代码,理想效果如下:

下面是我的实现完整代码,和书中一致:
<div class="app34">
<p>app34 滚动提示</p>
<div>
<ul class="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>0</li>
</ul>
</div>
<style>
.app34 .list {
width: 200px;
height: 100px;
overflow: auto;
border: 1px solid silver;
background: linear-gradient(red, red), /* 方便看效果,white 改为 red */
radial-gradient(at top, rgba(0, 0, 0, .8), transparent 70%);
background-repeat: no-repeat;
background-size: 100% 15px;
background-attachment: local, scroll;
}
</style>
</div>
上面的代码,两层背景一起滚动,background-attachment: local, scroll; 未生效,好像 attachment 只接受一个单一值,不能用逗号分隔多个参数?
谢谢。
测试环境: macOS 11.13.3, Chrome 64
p161,关于滚动提示的 css 代码,理想效果如下:

下面是我的实现完整代码,和书中一致:
上面的代码,两层背景一起滚动,
background-attachment: local, scroll;未生效,好像attachment只接受一个单一值,不能用逗号分隔多个参数?谢谢。