Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Desafio: Fontes | Text Styles
course content

Conteúdo do Curso

CSS Fundamentals

1. Introdução ao CSS

O que é CSS?Conectando HTML e CSSSeletores para Estilizar Elementos HTMLDesafio: Adicione Seus Primeiros EstilosDesafio: Adicione os Estilos utilizando o Nome da ClasseClasses Pseudo de Ação do UsuárioDesafio: Classes Pseudo de Ação do UsuárioCores do TextoTrabalho Eficaz com CSSDesafio: Variáveis em CSS

2. Estilos de Texto

Estilização de TextoFormatação de TextoDesafio: Formatação de TextoAdicionar Fontes Personalizadas à Página WebPropriedades da FonteDesafio: Fontes

3. Modelo de Caixa e Espaçamento de Elementos

Modelo de CaixaDimensionamento de CaixaAdicionar Espaço aos ElementosDesafio: Box-SizingClasses Pseudoestruturais e FuncionaisDesafio: Pseudo-Classes EstruturaisTipos de ElementosTrabalhe com Elementos de Nível de BlocoTrabalhe com Elementos InlineDesafio: Prever o Layout da Página

4. Flexbox

O que é o Flexbox?Direção FlexívelAlinhar Conteúdo HorizontalmenteAlinhar Itens VerticalmentePropriedades de Item FlexívelDesafio: FlexboxDesafio: Trabalhar com Flexbox

5. Efeitos Decorativos

Cor de FundoImagem de FundoTrabalhe com ImagensElementos Pseudo-DecorativosSombrasDesafio: Efeitos DecorativosPróximos Passos

CSS Fundamentals

Desafio: FontesDesafio: Fontes

Tarefa

Vamos aplicar diferentes propriedades de fonte a elementos específicos: Para h1:

  • Família da fonte: Arial
  • Tamanho da fonte: 36px
  • Peso da fonte: 600
  • Estilo da fonte: itálico

Para p:

  • Família da fonte: Georgia
  • Tamanho da fonte: 18px
  • Peso da fonte: 400
  • Estilo da fonte: normal
html

index.html

css

index.css

js

index.js

  • font-family: Especifica a família de fontes.
  • font-size: Define o tamanho da fonte.
  • font-weight: Define a espessura da fonte.
  • font-style: Especifica o estilo da fonte.
html

index.html

css

index.css

js

index.js

Tudo estava claro?

Seção 2. Capítulo 6
course content

Conteúdo do Curso

CSS Fundamentals

1. Introdução ao CSS

O que é CSS?Conectando HTML e CSSSeletores para Estilizar Elementos HTMLDesafio: Adicione Seus Primeiros EstilosDesafio: Adicione os Estilos utilizando o Nome da ClasseClasses Pseudo de Ação do UsuárioDesafio: Classes Pseudo de Ação do UsuárioCores do TextoTrabalho Eficaz com CSSDesafio: Variáveis em CSS

2. Estilos de Texto

Estilização de TextoFormatação de TextoDesafio: Formatação de TextoAdicionar Fontes Personalizadas à Página WebPropriedades da FonteDesafio: Fontes

3. Modelo de Caixa e Espaçamento de Elementos

Modelo de CaixaDimensionamento de CaixaAdicionar Espaço aos ElementosDesafio: Box-SizingClasses Pseudoestruturais e FuncionaisDesafio: Pseudo-Classes EstruturaisTipos de ElementosTrabalhe com Elementos de Nível de BlocoTrabalhe com Elementos InlineDesafio: Prever o Layout da Página

4. Flexbox

O que é o Flexbox?Direção FlexívelAlinhar Conteúdo HorizontalmenteAlinhar Itens VerticalmentePropriedades de Item FlexívelDesafio: FlexboxDesafio: Trabalhar com Flexbox

5. Efeitos Decorativos

Cor de FundoImagem de FundoTrabalhe com ImagensElementos Pseudo-DecorativosSombrasDesafio: Efeitos DecorativosPróximos Passos

CSS Fundamentals

Desafio: FontesDesafio: Fontes

Tarefa

Vamos aplicar diferentes propriedades de fonte a elementos específicos: Para h1:

  • Família da fonte: Arial
  • Tamanho da fonte: 36px
  • Peso da fonte: 600
  • Estilo da fonte: itálico

Para p:

  • Família da fonte: Georgia
  • Tamanho da fonte: 18px
  • Peso da fonte: 400
  • Estilo da fonte: normal
html

index.html

css

index.css

js

index.js

  • font-family: Especifica a família de fontes.
  • font-size: Define o tamanho da fonte.
  • font-weight: Define a espessura da fonte.
  • font-style: Especifica o estilo da fonte.
html

index.html

css

index.css

js

index.js

Tudo estava claro?

Seção 2. Capítulo 6
some-alt