1

Tenho um sistema com bootstrap e preciso alterar a FONT de todas as páginas.

Tem como alterar isto somente no bootstrap.min.css e não ter que fazer arquivo por arquivo? Como fazer?

O font-family que preciso não é o que já vem de padrão no bootstrap.

1
  • Faça uso do efeito cascata. O efeito cascata determina a prioridade para aplicação da regra de estilo ao elemento conforme descrito a seguir e na ordem decrescente de prioridade: 1 - dentro de uma tag HTML (definidos através do atributo style nos elementos); 2 - folha de estilo interna (definida na seção HEAD da própria página); 3 - folha de estilo externa (importado ou linkado); Portanto inclua sua folha de estilo alterando a FONTdepois da folha de estilo do boostrap.
    – user60252
    3/07/2018 às 23:37

2 Respostas 2

3

Esse é o padrão do font-family usado no body do Bootstrap 4 como vc pode conferir nesse link:https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.css

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

Basta substituir a font-family no bootstrap.min.css nessa classe e vc muda pro site inteiro.

body {
  font-family: 'minha-fonte', Helvetica; 
}

Vc tb pode fazer um override dessa forma, onde no font.css vc declara sua font-family no body, mas repare que ele tem que vir apos o css do Bootstrap:

<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="minhafont.css">
1

você pode definir uma classe na tag body ou depois do body criar uma div logo após o body(que é o mais recomendado).

Não recomendo você fazer alteração no arquivo do bootstrap, mas nada impede de você mexer nesse arquivo

Exemplo 1, você pode referenciar em um arquivo de estilos separados. Neste caso, você faz com que todos os estilos abaixo da sua div sejam respeitadas

<head>
<link rel="stylesheet" href=".../estilos/estilo.css" rel="stylesheet"> //aqui você informa onde está o seu arquivo de estilos
</head>
<body>
<div class="altera-fontes">
              //Aqui estará todo o conteúdo das suas páginas
</div>
</body>

E no seu arquivo de estilos ficaria o seguinte código:

.altera-fontes {
   font-style: normal; //caso queira deixar alterar o estilo da fonte
   font-size: 2.5em; //caso queira alterar o tamanho da fonte
   font-family: "Times New Roman" //caso queira mudar o tipo de fonte

}

Exemplo 2 Criar um estilo no seu html e fazer a alteração lá mesmo

</head>
<style>
   body{
         font-style: normal; //caso queira deixar alterar o estilo da fonte
         font-size: 2.5em; //caso queira alterar o tamanho da fonte
         font-family: "Times New Roman" //caso queira mudar o tipo de fonte
   }
</style>
<body>

Nesse segundo caso, você não precisa criar uma classe no CSS, você faz essa alteração no próprio body. (Lembrando que nesse caso não anula o fato de você criar uma classe no seu estilo, apenas mudei o lugar onde o estilo foi criado.)

Estes são apenas 2 das N formas que você pode fazer a alteração.

Para saber de mais informações de classes CSS acesse aqui

Caso queira saber mais informações sobre font recomendo esse site aqui

Tente isso e veja se isso funciona para você.

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 .