Question

我正在开发一个页面结构，我的代码位于我的代码的底部和上方，其他页面中有许多其他代码，我无法访问。

让名为Name1的类具有背景颜色：绿色，我需要覆盖并将其更改为红色。

看起来我的覆盖没有成功。如何使它工作？请帮帮忙。谢谢！

添加注意：我确实使用了开发人员工具来检查它。当我查看Name1时，我没有看到我想要覆盖的样式。它看起来像我的风格.Name1 {background-color：red！important;}是本地的，是全局的。我想知道JQuery是否有助于解决这个问题？

这是页面结构

<html>
   <body>
       <table>
           <tr>
             <td>
                 <div class="Name1"></div>
             </td>
             ................
             ..................
             <td>
                  <html> <!--This is my session -->
                      <head>
                           <style>
                                  .Name1{background-color: red !important;}
                           </style>
                      </head>
                      <body>
                           <div>
                            ................
                           </div>
                      </body>
                  </html>
             </td>
       </table>
   </body>

Answer 1

大多数元素都可以具有style=属性。例如，<a href="#myheader" style="text-decoration:none"></a>会删除链接的下划线。

这称为内嵌式。

Answer 2

作为一般的经验法则，不要使用内联样式，它们是丑陋的，并且会造成不良标记。

在您的情况下，在设置覆盖样式后，可能会将另一种样式应用于.Name1，您可以通过使用开发人员工具检查页面源来轻松检查这一点，分析{{1并检查包含样式表的顺序，您还可以检查CSS窗格并查看为该元素设置的规则。

为了解决您的问题（如果由于某种原因无法定义自己的样式表），您必须在<head>标记之后直接在元素上使用内联样式：

<head>

正如我上面所说，这通常是不好的做法，但是由于在应用第一个样式后声明了样式，它会覆盖以前的样式，因为当DOM渲染其顶部向下时：

<div class="Name1" style="background-color: blue !important">

Answer 3

您可能遇到了CSS特异性问题。如果在其他地方使用了更具体的定义，它将在您的定义中使用它。

More about CSS Specificity.

您能提供一个实时示例或真实链接，以显示正在播放的类和CSS源吗？

您还可以使用Chrome中的Web检查器等工具查看正在使用的规则（在样式选项卡，左栏中）。以下是您帖子中文字的网络检查员： web inspector example 请注意font-size中的.post-text规则是如何划掉的。选择器中的font-size规则从顶部开始被覆盖，这会被覆盖。这是因为这个选择器被认为是更具体的＆＃34;比从父母继承的那个（因为它直接选择元素）。通过这种方式，您可以看到每个规则的来源以及为什么选择相同规则和元素的其他声明。

覆盖位于某处的类

3 个答案: