0

Estou com uma dificuldade para sobrescrever algumas classes do Bootstrap utilizando um arquivo CSS que criei. Estou utilizando o Bundle para fazer essas alterações:

public static void RegisterBundles(BundleCollection bundles, bool premium =true)
{
    #region Default Web Site

   ..........

    #region Templates Layout

    if (premium)
    {
        bundles.Add(new StyleBundle("~/Templates/premium").Include(
        "~/Templates/*.css"));
    }


    #endregion

    #endregion

}

Declarei o bundle no Layout:

<!DOCTYPE html>
<html>
<head>
    <noscript>
        <meta http-equiv="refresh" content="0;url=/NoJScript" />
    </noscript>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")

    @Styles.Render("~/Templates/premium")
</head>
<body>

Código arquivo CSS:

.container .navbar-default {
    background-color: #a6d209;

E mesmo assim o nav bar não altera a cor que inserir no arquivo externo.

Projeto executando em Localhost

O arquivo está vindo na ordem que inserir no bundle, está correto. Eles está vindo depois do bootstrap.css e site.css

Carregamento do CSS externos

0

1 Resposta 1

1

Tem que verificar a ordem que o CSS está executando. Porem, se fizer dessa forma:

background-color: #a6d209 !important;

Teu CSS ira prevalecer.

9
  • Obrigado, sabe me informar como eu verificar a ordem? Por que inserir o bundle nessa ordem, achava que seguia ordem que inserir o arquivo. <code> bundles.Add(new StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/site.css")); if (premium) { bundles.Add(new StyleBundle("~/Templates/premium").Include( "~/Templates/*.css")); } </code> Commented 4/01/2017 às 16:57
  • No head. Se teu arquivo está incluindo antes ou depois do arquivo do bootstrap. Não esqueça de marcar essa respostas, caso ela tenha solucionado teu problema.
    – mau humor
    Commented 4/01/2017 às 16:58
  • Postei a imagem acima e o arquivo está vindo por último seguindo a ordem que inserir no bundle e mesmo assim não está alterando o nav-bar do bootstrap. Commented 4/01/2017 às 17:17
  • Verifique o resultado no browser. Normalmente vale as regras definidas por último. A não ser que o CSS anterior utilize "!important".
    – mau humor
    Commented 4/01/2017 às 17:18
  • Não usa, por que se eu inserir o mesmo css no arquivo "site.css" ele funciona normalmente...mesmo sem o !important Commented 4/01/2017 às 17:22

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .