javascript - 纯色背景生成器不会显示任何背景-6ren

javascript - 纯色背景生成器不会显示任何背景

转载作者：行者123 更新时间：2023-12-04 15:07:57

24

4

这里完全是新手。我正在尝试创建一个不是线性渐变类型版本的背景生成器，当我访问色轮时，背景不会改变。这是它的代码。

var css = document.querySelector("h3");
var color1 = document.querySelector(".color1");
var body = document.getElementById("gradient");

function setGradient() {
    body.style.background = "#"+ color1.value;

    css.textContent = body.style.background + ";";
}

color1.addEventListener("input", setGradient);

<body id="gradient">
    <h1>Background Generator</h1>
    <input class="color1" type="color" name="color1" value="#00ff00">
    <h2>Current CSS Background</h2>
    <h3></h3>
</body>

最佳答案

您几乎已经做到了，当您尝试分配正文的背景颜色时，需要删除的是 color1.value 之前的 "#"。 color1.value 中的值已经是十六进制颜色代码，因此它们具有起始哈希值。试试这个。

var css = document.querySelector("h3");
var color1 = document.querySelector(".color1");
var body = document.getElementById("gradient");
const currentColor = document.querySelector(".current");

function setGradient() {
    body.style.background = color1.value;
    css.textContent = body.style.background + ";";
}

color1.addEventListener("input", setGradient);

<body id="gradient">
    <h1>Background Generator</h1>
    <input class="color1" type="color" name="color1" value="#00ff00">
    <h2>Current CSS Background</h2>
    <h3></h3>
</body>

关于javascript - 纯色背景生成器不会显示任何背景，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/65746273/

24

4

0

文章推荐： ASP.NET 4 WebAPI : route with back slash

文章推荐： web-services - Chrome是否本身会超时进行网络服务调用？

文章推荐： css - 保持覆盖文本的垂直居中对齐

ios - iOS背景颜色-纯色
我正在尝试更改iOS背景颜色，但是我认为透明度(alpha:1)似乎在起作用并改变了预期的颜色。 In **AppDelegate.m** rootView.backgroundColor = [
javascript - WebGL 纯色
https://www.dropbox.com/s/4zkhtdv4yaqhpxy/Screenshot%20from%202015-01-28%2010%3A42%3A02%201.png?dl=0
c++ - 照明不适用于 OpenGL - 纯色
照明不工作，对象显示为纯色。颜色本身随 Material 或照明参数而变化，但没有阴影或任何纯灰色。部分代码如下: glPolygonMode(GL_FRONT_AND_BACK, GL_FILL)
浅谈Java设置PPT幻灯片背景——纯色、渐变、图片背景
ppt幻灯片生成时，系统默认是无色背景填充，幻灯片设计需要手动设置背景效果，可设置颜色填充或者图片背景填充。本文将对此介绍具体实现方法。 jar文件导入方法（参考）：步骤1：在java程序中可

首页

博学

6Ren·AI

商城

javascript - 纯色背景生成器不会显示任何背景