Question

（对不起我的英语不好）

我想创建一个主菜单背景为白色的网站，但是例如当我进入登录区域时，背景颜色变为黑色，我该怎么做

P.S：我是HTML的新手

Answer 1

如果制作不同的页面，并且每个页面都有自己的菜单，则可以进行内联样式ex：在首页在登录页面

但是如果您的项目中有一个菜单，则可以使用javascript获取窗口的网址，然后检查它是否在家里，使背景为白色，否则在登录页面中，使背景为黑色例如： var menu = document.getElementById（“ menu”）

if(window.location == "home/")
{
  menu.style.backgroundColor = "white";
}
else if (window.location == "login/") 
{
  menu.style.backgroundColor = "black";
}

您应该将网址写为真

Answer 2

一些指针。

首先，使用大量DIV（或section，aside等）。 DIV是您将其他HTML代码放入其中的包装器/容器。您可以设置该代码容器的样式，使其具有不同的背景颜色（或不同的填充或位置，等等）。大多数初学者会犯这样的错误：使用的容器太少。 （部分和Asides的功能与DIV相同，但搜索引擎将其区别对待。）

接下来，发现javascript（及其易于使用的表弟jQuery）。如果您想让样式即时更改，那就使用javascript。

jQuery几乎类似于另一种语言，但实际上它是一个javascript库，在运行时变成了纯javascript-但您不必担心细节。只需使用它-我们许多人认为它对javascript来说是一个巨大的改进，特别是对于初学者。请注意，这不是一个或另一个决定-您可以将纯JavaScript与jQuery代码混合/匹配。在jQuery上做一个小时的教程，然后重复该教程十次（直到您掌握了它）。

所以，你的问题。

您将主菜单放在DIV中-实际上，整个菜单可以由DIV内部的DIV组成-但您会将外部DIV背景颜色设置为白色。

当出现登录屏幕时（听起来像是javascript / jQuery，对我来说...），您将使用相同的代码来更改主菜单的背景颜色。使用jQuery，代码可能看起来像这样：

$('#login_button_ID').click(function(){
     $('#login_div_ID').show();
     $('#mainmenu_div_ID').css('background','black');
     // -OR- $('#mainmenu_div_ID').addClass('bgBlack');
});

不是那么复杂吗？

Answer 3

欢迎加入堆栈溢出！您将希望更好地学习 CSS 和 HTML ，以使您的网站看起来更加用户友好。通过这种方式，您可以（使用嵌入式CSS）更改网页上的背景颜色，并在代码中添加以下代码：

 <style>
    body {
        color: rgb(255, 255, 255); /* White Color */
    }

    login {
        color: rgb(0, 0, 0); /* Black Color */
    }

    </style>

您需要在CSS中标识您选择的（登录）元素，以使您能够对其进行更改。

上面的示例使用 rgb 颜色代码选择所需的颜色，但是颜色也可以表示为十六进制（＃ff0000）， HSL 以及更多。

更多信息，请点击此处：www.w3schools.com/html/htmlColors

www.khanacademy.org/computing/computer-programming/html-css/

如何在网站的不同位置更改背景颜色？

3 个答案: