gpt4 book ai didi

image - 我有一个带有蓝线、透明背景的 PNG,没有别的。 CSS中有没有办法让线条变白?

转载 作者:太空宇宙 更新时间:2023-11-04 03:10:12 24 4
gpt4 key购买 nike

我有一个 png 蓝线,透明背景,没有别的。有没有办法在 css 中使线条白色

最佳答案

CSS用于修改 HTML 的外观.它不能真正直接影响图像。您可以使用两个相同大小的图像,并使用 JavaScript 在它们之间切换。

这是一种可能的方法:

HTML

<body>
...
<div>
<image id="blue-img" class="currentFrame" src="/img/blue.png" />
<image id="white-img" class="hiddenFrame" src="/img/white.png" />
</div>
...
</body>

CSS

.currentFrame {
display: block;
}
.hiddenFrame {
display: none;
}

此时,您可以使用以下 JavaScript 隐藏一张图片并显示另一张图片。因为图片大小相同,并且一起出现在 HTML DOM 中,所以看起来图片占据了相同的空间。

function changeFrame() {
removeClass("blue-img", "currentFrame");
addClass("blue-img, "hiddenFrame");
removeClass("white-img", "hiddenFrame");
addClass("white-img", "currentFrame");
}

// Add the given class to the DOM element with the given id
function addClass(id, class) {
...
}

// Remove the given class from the DOM element with the given id
function removeClass(id, class) {
...
}

执行addClassremoveClass()函数留给读者作为练习,但如果您使用 jQuery 或其他一些 DOM API 库,它会容易得多。

您还可以使用 HTML5 <canvas>元素,如果您不关心向后兼容性,或者如果您需要过渡动画。这也将涉及一些 JavaScript 编码。

关于image - 我有一个带有蓝线、透明背景的 PNG,没有别的。 CSS中有没有办法让线条变白?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29686490/

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