更改背景颜色不适用于 chrome答案

【问题标题】：changing background color wont work on chrome更改背景颜色不适用于 chrome
【发布时间】：2014-05-22 14:33:13
【问题描述】：

我必须放大和缩小才能更改整个背景颜色（但它在 IE 中可以正常工作，没有任何问题）！ P.S: body bg 默认为灰色。

** 按钮代码在正文的末尾**

** 当我更改选项卡并返回它时，它也可以正常工作**

这是整个网站的代码

<body style="background-color:gray; ">
    <div style=" float:left;background-color:white; width:13%;height:100%; position:fixed; left:0; top:50px; border: 2px solid black;">
        <div id="menu" class="menu">    <a href="image.html">Shirts</a>
            <br/>----------------------
            <br/>   <a href="info.html">Shoes</a>
            <br/>----------------------
            <br/>   <a href="Text.html">Accessories</a>
            <br/>----------------------
            <br/>   <a href="Media.html">About Us</a> 
            <br/>----------------------
            <br/>   <a href="mailto:zaid-sh@live.com">Contact Us</a>
            <br/>----------------------
            <br/>
        </div>
    </div>
    <div id="middle" style=" background-color:white; position:absolute; height:auto%; width:70%; left:15%; top:100px; ">
        <div style="position:relative;left:10px;top:10px;margin-right:5%; border: 3px solid #a3a3a3 ; border-spacing:10px;">
            <img src="shirt.jpg" alt="shirt" height="325px" width="412" />
        </div>
        <br/>
        <div style="position:relative;left:10px;top:10px;margin-right:5%; border: 3px solid #a3a3a3;">
            <img src="shoes.jpg" alt="shoes" height="325px" width="412" />
        </div>
        <br/>
        <div style="position:relative;left:10px;top:10px;margin-right:5%; border: 3px solid #a3a3a3;">
            <img src="watch.jpg" alt="watch" height="325px" width="412" ; "/>

        </div>
        <br/>       
    </div>

    <div  id="header-fixed " style="background-color:#4B4B4B; position:fixed; top:0;right:0; width:100%; height:50px; border: 2px solid black; ">
        <input class ="resize " id="pic " type="image " src="list.png "  onclick="show(); "/>

        <input class = "resizecol " type="image " src="blue.png " alt="white " value= "White " onclick="document.body.style.backgroundColor='blue' ; "/>
        <input class = "resizecol " type="image " src="black.png " alt="white " value= "White " onclick="document.body.style.backgroundColor='black' ; "/>
        <input class = "resizecol " type="image " src="white.png " alt="white " value= "White " onclick="document.body.style.backgroundColor='#FFFFFF' ; "/>

        <input id="Register " dir="ltr " style="position: fixed; right: 0px; top: -3px; height: 54px; width: 123px; " 
            type="image " value="Register " alt="Regsiter " src="register.png " />

    </div>
</body>

【问题讨论】：

在你的 JavaScript 添加样式中添加!important 有什么不同吗？例如。 document.body.style.backgroundColor = 'blue !important';
似乎在 Chrome 中运行良好。 http://jsfiddle.net/jY2Hj/ 点击输入框改变颜色就好了。您的问题可能是文件中的某些 CSS 覆盖了颜色更改。因此，为什么所有 CSS 都应该保留在 CSS 文件中并在那里进行管理，以便您可以分配类来为您完成工作并让 CSS 独立管理。还要检查您是否偶然在 Chrome 中禁用了 JavaScript。
P.S.：这里有错字：<img src="watch.jpg" alt="watch" height="325px" width="412" ; "/>应该是<img src="watch.jpg" alt="watch" height="325px" width="412" />
@BigChris 当我添加 !important 按钮甚至不再起作用了。
好的，怎么样：document.body.style.cssText = 'background-color:#ffffff !important';

标签： javascript css google-chrome

【解决方案1】：

试试这个

  body{background-color: #657383;}

【讨论】：