Você já viu como alterar a cor de fundo e a cor do texto na página.
Mas você pode fazer muito mais com o texto em CSS.
Para começar, vamos alterar a fonte.
O que é uma fonte? Você provavelmente já sabe o que é, mas você pode
não saber com essa palavra.
Fonte é o estilo das letras que formam as palavras.
Se as letras têm flores sobre elas, ou qual a espessura dela,
ou se elas parecem que são escritas com uma caneta.
Será mais fácil se eu mudar o tipo de letra nesta página.
Vou usar < p > como regra CSS que seleciona todos os parágrafos,
e adicionar um propriedade font-family (família de fontes) aqui.
font-family: sans-serif;
Viu como as letras mudaram quando fiz isso?
Elas parecem mais simples agora.
Agora vou mudar a font-family de volta especificando dessa vez a serif.
Percebeu que as letras ficaram um pouco mais complexas?
Uma fonte serif são aquelas fontes que parecem com uns "pezinhos" nas letras.
Quando dizemos ao navegador para usar uma font-family serif, ele usará o padrão
serif para o computador. Que normalmente é a fonte "Times New Roman".
Não sou um grande fã desse tipo de letra, no entanto,
vou mudá-la de volta agora para sans-serif.
O 'sans' vem do latim e significa "sem".
Assim, uma fonte sans-serif é aquela que não tem aqueles "pezinhos" nas letras.
É por isso que são mais simples.
Quando dizemos ao navegador para usar uma font-family sans-serif, ele usa
o padrão sans-serif para esse computador, que normalmente é 'Arial' ou 'Helvetica'.
Mas aqui está um ponto importante: Ele vai escolher a fonte padrão
do computador, e não a do autor da página.
Assim, podemos muito bem estar vendo duas fontes sans-serif diferentes agora,
se o seu sistema tem um padrão diferente do meu.
Às vezes, tudo bem, mas tem vez que eu quero que o visitante da página veja
exatamente as mesmas fontes como eu vejo.
Nesse caso, posso especificar precisamente o nome da fonte. Por exemplo, 'Helvetica'.
Isto vai funcionar, desde que você e eu tenhamos Helvetica em nossos computadores.
Mas nem todos os computadores têm as mesmas fontes, nesse caso o computador irá
ignorar essa propriedade .
Felizmente o CSS nos permite especificar uma font-family de reserva no caso de uma
fonte específica não existir em um computador.
Colocamos uma vírgula depois de Helvetica e em seguida colocamos sans-serif.
Agora, o computador procurará Helvetica, e se não encontrá-la, ele vai usar a sua
fonte padrão sans-serif.
Geralmente, quando você especificar uma fonte específica como Helvetica, você deve
sempre especificar um nome de reserva da família também.
Além da serif e sans-serif há um par de outros nomes de font-family genérica
que podemos usar.
Se quiséssemos nossas letras manuscritas, podemos especificar font-family: cursive.
Se quiséssemos as letras mais chiques, podemos tentar a font-family: fantasy.
Ou se queremos que pareçam que foram escritas numa máquina de escrever?
Poderíamos especificar a font-family: monospace.
A fonte 'monospace' é de largura fixa, o que significa que todas as letras ocupam
a mesma largura exata.
De fato, você já viu um monte de fontes 'monospace' aqui na Khan Academy,
porque sempre usamos a fonte 'monospace' para editores de código.
Isso é porque queremos que todo o nosso código esteja alinhado,
independente das palavras.
Agora que você sabe como alterar o tipo de letra, use seu poder com sabedoria.
Se quer uma boa aparência para sua página, use só algumas famílias diferentes,
e chegue a um par de fontes que ficam bem juntas.
Mas se não quiser uma boa aparência, então ela vai ficar feia igual uma ostra.
Vá em frente e mãos à obra.
Traduzido por [Fernando dos Reis] Revisado por [Gabriel Mello Fernandes]