gpt4 book ai didi

css - 如何根据内容设置背景图像(固定图案可重复)和背景颜色可变(DIV)

转载 作者:行者123 更新时间:2023-11-28 19:18:20 25 4
gpt4 key购买 nike

我想用 Angular 构建一个单页应用程序,我正在努力寻找一种方法来获得固定的背景图像(某种可重复的白色图案,可以在标签 BODY 中)。

但是根据 DIV 的内容,我希望能够在这个固定的背景图像后面有不同的颜色(例如蓝色),如果你再滚动一点,颜色就会变成红色。

css 大师可以为我解决这个问题或帮助我找到实现它的方法吗?

也许处理 z-index,某种视差?

最佳答案

这是一个 Angular 应用程序的示例,其中透明的 background-image 是静态设置的,background-color 是插入定义的(在 html 代码中),使用“ng 风格”。颜色是用户通过输入设置的变量。您可能想要一些略有不同的东西,但希望能理解!

var myApp = angular.module('app', []);
body {
background-image: url(https://www2.cs.arizona.edu/icon/docs/ipd234/pattern.gif);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<body ng-app="app" ng-style="{'background-color': colorName}">

<input type="text" ng-model="colorName" placeholder="enter a color name e.g. green">
</body>

关于css - 如何根据内容设置背景图像(固定图案可重复)和背景颜色可变(DIV),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57855503/

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