Изменить цвет текста CSS3

Я пытаюсь изменить цвет текста этой ссылки, я использую шаблон начальной загрузки Twitter. Я могу изменить размер, шрифт, отступы и цвет фона этого текста, но я не могу изменить цвет самого текста. Я также использую шрифт, который я нашел в Интернете.

HTML:

 <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <!-- You'll want to use a responsive image option so this logo looks good on devices - I recommend using something like retina.js (do a quick Google search for it and you'll find it) -->
            @Html.ActionLink("Fat", "Index", new { controller = "Home" }, new { @class = "navbar-brand" })<br />
            @Html.ActionLink("Savage", "Index", new { controller = "Home" }, new { @class = "navbar-brand" })
        </div>

CSS:

.navbar-brand {
    font-family: 'TribecaRegular';
    color: green;
    font-size:xx-large;
    padding-right: 150px;
}

цвет шрифта всегда серый и ничего другого.


html css twitter-bootstrap textcolor
person Nick    schedule 09.02.2015    source источник
comment
Я думаю, что внутри .navbar-brand есть тег <a>. Если это так, вам нужно сослаться на тег <a>, чтобы изменить цвет.   -  person Josan Iracheta    schedule 10.02.2015

Ответы (4)


arrow_upward
1
arrow_downward

.navbar-brand окрашен бутстрапом.

Правило, используемое начальной загрузкой, .navbar-default .navbar-brand {...}

Поэтому вам нужно создать правило равной или более высокой специфичности

.navbar-default .navbar-brand {
    font-family: 'TribecaRegular';
    color: green;
    font-size:xx-large;
    padding-right: 150px;
}

Вышеприведенное будет работать, если оно будет размещено после правила начальной загрузки.

Или вы можете определить его с помощью .navbar-default a.navbar-brand, чтобы оно использовалось независимо от того, где вы размещаете правило.

person Gabriele Petrioli    schedule 10.02.2015
comment
Спасибо, это исправлено. - person Nick; 12.02.2015

arrow_upward
2
arrow_downward

Вы не нажимаете тег span, вам нужно сделать что-то вроде этого:

.navbar-brand span{

    color:green;

}
person Anders Sørensen    schedule 09.02.2015

arrow_upward
0
arrow_downward

.navbar-brand не существует, но если вы измените его на правильную область действия и по-прежнему видите проблему, выберите тег span, как предложил Андерс.

person stacigh    schedule 10.02.2015

arrow_upward
0
arrow_downward

Всегда можно просто присвоить идентификационный тег любому тексту, который необходимо изменить.

.navbar-header #someID{
    color: green;
}

Или, если вы хотите поразить весь этот элемент, сделайте, как сказали другие плакаты, нацельтесь на тег

person Kevin Leegsma    schedule 10.02.2015