2

Gostaria de uma resposta didática sobre como usar Bootstrap para determinar tamanhos de fontes. Para ajudar, estou usando exatamente as seguintes medias-queries:

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

}

/* Landscape phones and down */
@media (max-width: 480px) {

}

Pelo que eu entendi, deve-se dar um tamanho base para transformar px em em mas para continuar o meu trabalho e meu aprendizado, gostaria de ter certeza como usar isto.

1 Resposta 1

1

Como você disse, a medida em é uma medida relativa, ou seja, ela é calculada a partir de um valor fixo "base". Sendo assim, você poderia fazer o seguinte código:

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
    body{
        font-size:15px;
    }
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    body{
        font-size:25px;
    }
}

/* Landscape phones and down */
@media (max-width: 480px) {
    body{
        font-size:50px;
    }
}

E toda vêz que você atribuisse a propriedade font-size: [n]em (onde [n] pode ser qualquer valor float > 0) para algum elemento, ele teria o tamanho da fonte de acordo com a media-query atual.

Exemplo: FIDDLE

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 .