Soy un novato. Sé que puedo asignar diferentes fuentes para el Bootstrap 4 como esta por defecto,

font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";

Lo que quiero saber si puedo intentar construir un sitio web con dos fuentes de emparejamiento por ejemplo,

font-family: "Roboto", "Open Sans";

Cómo sería el código anterior afectan a elementos de Bootstrap 4. Qué elementos se consigue Roboto o Open Sans.

  • Depende de qué clase o se puede asignar que la nueva familia de fuentes para. Se le asigna a los h1? p? *? Lo que hace que las líneas antes font-family parece?
  • Creo que te refieres a que tengo que asignar según sea necesario para cada elemento de Bootstrap otra cosa que todos predeterminado a Roboto para el ejemplo anterior?
  • Ver las respuestas abajo. Que aclarar lo que quiero decir con esto.
InformationsquelleAutor CodeMan | 2017-11-02

5 Comentarios

  1. 4

    Para scss usuarios:

    Decir que eligio fuentes de google desde aquí (pick menos a la carga de la página rápido):
    https://fonts.google.com/specimen/Roboto

    Y, la colocó en su index.html en <head>:

    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400" rel="stylesheet">

    O, la colocó en su hoja de estilos:

    <style>
    @import url('https://fonts.googleapis.com/css?family=Roboto:300,400');
    </style>

    y en secs hacer esto:

    $font-family-base: 'Roboto', sans-serif; //add this line first before importing bootstrap
    @import "~bootstrap/scss/bootstrap";

    que es.

  2. 2

    Puede invalidar el arranque de las clases con sus propias reglas css.

    Por ejemplo:

    p {
      font-family: "Roboto", sans-serif;
    }
  3. 1

    Esto sería asignado en cualquier elemento que usted está tratando de estilo, así por ejemplo:

    h1,h2,h3,h4,h5,h6 {
    font-family: "Roboto";
    }

    Esto podría asignar Roboto a todos los Títulos…

  4. 0

    Además, también se puede especificar para qué párrafos de cada fuente se aplica:

    <p class="sentenceA">First Paragraph with Roboto font applied to it.</p>
    <p class="sentenceB">Second Paragraph with Open Sans font applied to it.</p>
    <p class="sentenceC">Third Paragraph with Roboto and Open Sans fonts applied to it.</p>
    
    //and in your stylesheet have something like:    
    
        .sentenceA p
        {
            font-family: "Roboto";
        }
    
        .sentenceB p
        {
          font-family: "Open Sans";
        }        
    
        .sentenceC p
        {
           font-family: "Roboto", "Open Sans";
        }  

    Espero que esto ayude.

  5. 0

    También puede utilizar levanta sass variables para cambiar la fuente predeterminada-de la familia.
    Esto es lo que el valor predeterminado es
    $font-family-sans-serif: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

    $font-family-sans-serif: Roboto;

    Puede cambiar si lo desea y construir sass compilador.

Dejar respuesta

Please enter your comment!
Please enter your name here