gpt4 book ai didi

css - 使用 div 阻止文本的可见性?

转载 作者:太空宇宙 更新时间:2023-11-04 08:31:39 25 4
gpt4 key购买 nike

我在 material.io 上发现了这个效果:https://material.io/gallery/

图像是固定的,被黑色的覆盖了,但是z-index一定比它小,因为第一个bg覆盖了它。在我的 pov 中,它唯一的工作原理是,当另一个没有任何不透明度的 div 挡住第一张图像时。这是可能的还是他们使用了不同的方法?

最佳答案

编辑:这类似于视差但不完全是视差。如果您检查 html,您会看到 image/svg 部分不会滚动,但文本会滚动。通过给 svg 部分不同的 z-index 值,这是可能的。不同部分的图像不同,只是那些不随文本移动,所以看起来好像图像在重复。

我建议您浏览一下他们的 CSS 以获得更好的理解。

这种效果称为视差效果。您可以使用类似 http://materializecss.com/parallax.html 的库创建它,或者您可以创建自己的 https://www.w3schools.com/howto/howto_css_parallax.asp

关于css - 使用 div 阻止文本的可见性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44740609/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com