Como definir famílias de fontes, tamanho, peso, estilo e como usar Google Fonts
As propriedades de fonte controlam a aparência tipográfica do texto: qual fonte usar, qual o tamanho, se é negrito, itálico e assim por diante.
A propriedade font-family define qual fonte será usada. É uma boa prática listar mais de uma opção: o navegador usa a primeira disponível e vai para a próxima se não encontrar.
Carregando...O último valor costuma ser uma família genérica como sans-serif, serif ou monospace, garantindo que sempre haverá uma fonte de fallback.
A propriedade font-size define o tamanho do texto.
Carregando...rem é uma unidade relativa ao tamanho da fonte do elemento <html>. É bastante usada por facilitar o ajuste de proporções em toda a página de uma vez só.
A propriedade font-weight controla se o texto é normal ou negrito.
Carregando...Os valores numéricos vão de 100 a 900 em múltiplos de 100, mas só funcionam se a fonte tiver aquele peso disponível.
A propriedade font-style define se o texto é itálico.
Carregando...O Google Fonts oferece centenas de fontes gratuitas que você pode usar em qualquer projeto. Para incluir uma delas, adicione um <link> no <head> do HTML apontando para a fonte escolhida.
Carregando...Depois, use normalmente no CSS:
Carregando...O endereço do link você obtém diretamente no site fonts.google.com, escolhendo a fonte e os pesos desejados.
Assim como border e background, a propriedade font aceita vários valores em uma só linha.
Carregando...A ordem é: estilo peso tamanho/line-height família. Na prática, a maioria dos desenvolvedores prefere as propriedades separadas para facilitar a leitura.