javascript - 如何改变整个网站的颜色和背景

Question

我需要更改现有购物车网站的颜色和背景，以便所有背景均为蓝色，所有文本均为黑色。

当鼠标悬停在 anchor 元素上时，其背景应变为灰色。

本网站是使用 jquery、jquery 插件、jquery-ui 设计的， ASP.NET/Mono MVC3，Razor View 。 .使用 jquery ui 默认主题，但在可能的地方颜色和背景在非 jquery ui css 文件中指定。

有很多 css 文件，因此更改所有这些文件需要大量工作。

如何实现？是否可以向页面添加一些 jquery 或其他插件 javascript 代码以进行此类调整或其他想法？

应该改为使用蓝色和黑色。 如何实现？

更新

大多数 css 文件都包含在 Razon Site.cshtml 文件中，该文件是所有文件的母版页。 css 文件是静态的，出现在每个页面的开头:

<link rel="stylesheet" href="/comp/themes/base/jquery.ui.all.css"
    type="text/css" title="ui-theme" />
<link href="/comp/Content/Css/jquery.ui.menubar.css" rel="stylesheet"
    type="text/css" />

<link href="/comp/Scripts/jBreadCrumb/Styles/BreadCrumb.css" rel="stylesheet"
    type="text/css" media="screen" />
<link href="/comp/Scripts/Pikachoose/jquery.fancybox.css" rel="stylesheet"
    type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="/comp/Scripts/jcarousel-0.2/skins/tango/skin.css" />
<link href="/comp/Content/Css/Site.css" rel="stylesheet" type="text/css" />

使用了jquery-ui menubar, breadcrumb, fancybox, pikachoose jcarousel插件

Answer 1

首先，您不会为此使用 JavaScript，因为它会产生额外的加载时间，对禁用 JavaScript 的用户不起作用，而且完全没有必要。

要更改页面的背景颜色，您可以找到 body 标记并添加或更改其 background(或 background-color )属性:

body {
    background:#F00; /* #F00 being the hex representation of "red" */
}

您的网站可能有多个 CSS 文件，但它应该有一个全局 CSS 文件，用于已应用于所有页面的样式。如果不是这种情况，您真的应该考虑将所有常用样式组合到一个文件中，并将其包含在您的所有页面中。

如果更改您的body 样式不会改变任何内容，您将需要找出网站当前从何处获取其背景。如果有两个文件 body { background:...; } 声明，后者包含的 CSS 文件将覆盖前者。也就是说，您可以通过查阅浏览器的元素检查器来查找正文的“计算样式”，从而轻松找到正在绘制的颜色。

编辑:根据您最近的编辑，文件名“/comp/Content/Css/Site.css”是您要更改的文件。