Fontes em CSS

Esta é uma parte disponibilizada gratuitamente do curso de HTML 5 e CSS, com link para os videos do curso e a tabela de referência de fontes consideradas web safe, ou seja, aquelas comumente disponíveis na maioria das plataformas onde uma página é exibida. Observe que nem todas estas fontes estão disponíveis em todos os ambientes, e é recomendável disponibilizar duas ou três alternativas, como mostrado nas videoaulas.

Acompanhe os vídeos disponíveis para aprender o uso de fontes em CSS. Para receber um e-mail sempre que um novo conjunto de aulas for disponibilizado, apenas cadastre seu e-mail.

Se você gostou deste material, apoie divulgando ou linkando para o mesmo. O link www.alfamidiaonline.com.br/fontes é um link permanente.

---

Videos de Uso de Fontes em CSS

As 5 fontes pré-definidas em CSS

Definindo uma fonte em CSS

Outros atributos de fonte

---

Fontes Web Safe Sans-serif

Arial, Arial Black, Arial Narrow, Calibri, Candara, Century Gothic, Franklin Gothic Medium, Tahoma, Trebuchet MS, Verdana.

Fontes Web Safe Serif

Baskerville, Bodoni MT, Book Antiqua, Calisto MT, Cambria, Garamond, Georgia, Goudy Old Style, Lucida Bright, Palatino Linotype, Perpetua, Rockwell, Times New Roman.

Fontes Web Safe Fantasy

Copperplate, Papyrus.

Fontes Web Safe Cursive

Comic Sans MS, Lucida Handwriting, Monotype Corsiva,

Fontes Web Safe Monospaced

Consolas, Courier New, Lucida Console, Lucida Sans Typewriter,

---

Atributos de fontes

font-style

O atributo font-style pode ter os valores normal,italic e oblique, sendo que estes dois tem apresentações praticamente iguais:

Sans-serif padrão - font-style=normal

Sans-serif padrão - font-style=italic

Sans-serif padrão - font-style=oblique

font-variant

Permite definir que as mínusculas são apenas variações de tamanho menor dos caracteres maiúsculos.

Sans-serif padrão - font-variant=normal

Sans-serif padrão - font-variant=small-caps

font-weight

Com valores de 100 a 900, permite definir o peso da fonte, sendo 700 geralmente equivalente a negrito.

Sans-serif padrão - font-weight=100

Sans-serif padrão - font-weight=200

Sans-serif padrão - font-weight=300

Sans-serif padrão - font-weight=400

Sans-serif padrão - font-weight=500

Sans-serif padrão - font-weight=600

Sans-serif padrão - font-weight=700

Sans-serif padrão - font-weight=800

Sans-serif padrão - font-weight=900

font-size

Define o tamanho, que pode ser especificado como um valor entre xx-small e xx-large, um número em pontos, ou um percentual.

Sans-serif padrão - font-size=xx-small

Sans-serif padrão - font-size=x-small

Sans-serif padrão - font-size=small

Sans-serif padrão - font-size=medium

Sans-serif padrão - font-size=large

Sans-serif padrão - font-size=x-large

Sans-serif padrão - font-size=xx-large

Sans-serif padrão - font-size=10pt.

Sans-serif padrão - font-size=16pt.