Question

我有以下自动生成的标记：

<th id="__ID__TH__" class="__GENERATED_CLASSES__">
    <a href="#" id="__ID__A__" class="__OTHER__GENERATED_CLASSES__">
        Some text
    </a>
</th>

我需要申请color: #21610B;。问题是th和a标记是由UI - 框架生成的，因此我无法直接影响它们。我唯一能做的就是将style属性应用于th和a标记。

Answer 1

<强> Inline styling is a bad practice.

您不能在CSS文件中插入此样式吗？

th a,
th a:link,
th a:hover,
th a:visited,
th a:active, {
    color: #21610b;
}

Answer 2

HTML

<th id="__ID__TH__" class="__GENERATED_CLASSES__">
  <a href="#" id="__ID__A__" class="__OTHER__GENERATED_CLASSES__" style="color: #21610B;">
        Some text
    </a>
</th>

由于样式是内联的，它将覆盖任何其他样式集。

的Javascript

如果您无法做到这一点，那么您可以随时使用一些javascript来更改字体颜色。

Pure JS：

var x = document.getElementById('someId');
x.style.color = '#21610B';

jQuery的：

$( document ).ready(function() {
    $('#someId').css('color', '#21610B');
});

CSS

您也可以将其添加到CSS中。如果您知道该类是什么，然后将其设置为类，如果没有，则需要设置！important标记。

th a {
    color: #21610b; !important
}

或

th a.__OTHER__GENERATED_CLASSES__ {
    color: #21610b;
}

Answer 3

如果由于某种原因链接中的内嵌样式不起作用，您也可以在链接中添加<span>标记。

<th id="__ID__TH__" class="__GENERATED_CLASSES__">
    <a href="#" id="__ID__A__" class="__OTHER__GENERATED_CLASSES__">
        <span style="color: #21610B;">Some text</span>
    </a>
</th>

......但是没有必要。没有多少可以使用！important标记覆盖内联样式。

Answer 4

如果你能避免它，请记住使用！important或inline-styles是一种可怕的做法。

请始终使用CSS特性来覆盖您的样式。

由于CSS特异性，内联样式具有最高的特异性。

我建议你阅读我刚才写的这篇文章：

http://blog4coders.com/css-specificity/

最后，如果您真的无法使用纯CSS覆盖，那么您可以在Javascript / Jquery中应用这些样式，因为它们将作为内联样式添加到CSS样式表之上。

<强>的Javascript

var elements = document.querySelectorAll(".bar");

for (var i = 0; i < elements.length; i++) {
    elements[i].style.color = "#21610B";
}

JSFIDDLE http://jsfiddle.net/a_incarnati/a8w2a3hn/1/

<强> Jquery的

$( document ).ready(function() {
    $('.generated-classes').css('color','#21610B', 'important');
});

JSFIDDLE： http://jsfiddle.net/a_incarnati/a8w2a3hn/2/

由于css（）jQuery方法接受3个参数：

jQuery.style(name, value, priority);

Answer 5

<th id="__ID__TH__" class="__GENERATED_CLASSES__">
    <a href="#" style="color: #21610B !important" id="__ID__A__" class="__OTHER__GENERATED_CLASSES__">
        Some text
    </a>
</th>

Answer 6

您可以添加样式属性：

<th style="color: #21610B!important" id="__ID__TH__" class="__GENERATED_CLASSES__">
    <a style="color: #21610B!important" href="#" id="__ID__A__" class="__OTHER__GENERATED_CLASSES__">
        Some text
    </a>
</th>

如何在<a href=""></a>内为文本设置颜色

6 个答案:

HTML

的Javascript

CSS