Menu
Coddy logo textTech
COMEÇAR A APRENDER
flag Pt iconPortuguêsdown icon

Foto de Perfil

Parte da seção Fundamentals do Journey de HTML da Coddy — lição 32 de 60.

challenge icon

Desafio

Fácil

Tudo bem, é hora de adicionar a foto do perfil! Você pode usar qualquer imagem que desejar. Sinta-se à vontade para usar o link do exemplo abaixo.

  1. Após a primeira div (a seção de cabeçalho), crie outra <div>. Dentro dela, adicione uma tag <img>.
  2. Defina o src para linkar para sua imagem e use os atributos width e height para controlar seu tamanho.

Por exemplo:

  • src - https://storage.googleapis.com/coddy-15505.appspot.com/public/avatars/avatar25.png
  • width - 200
  • height - 200"

Experimente você mesmo

<!DOCTYPE html>
<html>
    <body>
        <!-- Header Section -->
        <div>
            <h1>John Doe</h1>
            <p>Web Developer | Creative Thinker</p>
        </div>
    </body>
</html>

Todas as lições de Fundamentals

1Fundamentos do HTML

O que é HTML?Estrutura Básica do HTMLTags e ElementosAninhamento e Fechamento de TagsComentários em HTML

4Cartão de Receita

Visão Geral do ProjetoTítulo e Descrição da ReceitaLição de projetoIngredientesLição de projetoPassosLição de projeto

7Página de Perfil Pessoal

Visão Geral do ProjetoSeção de CabeçalhoLição de projetoFoto de PerfilLição de projetoSeção Sobre MimLição de projetoLinks SociaisLição de projeto

10Tabelas

Fundamentos de TabelasAdicionando LegendasMesclando Linhas e ColunasRecapitulação - Tabelas

2Texto e Formatação

TítulosParágrafosQuebras de LinhaTexto em Negrito e ItálicoNegrito e Itálico NovamenteRecapitulação - Formatação

5Adicionando Conteúdo

Atributos HTMLLinksLinks para Novas PáginasImagensAtributos de Imagem

8Formulários e Inputs Parte 1

Fundamentos de FormuláriosInputs de TextoAtributos de InputCampo de SenhaLabels para InputsRecapitulação - Formulário Básico

11Página de Inscrição de Evento

Visão Geral do ProjetoSeção de CabeçalhoLição de projetoSeção de Detalhes do EventoLição de projetoFormulário de InscriçãoLição de projetoSeção de RodapéLição de projeto

3Trabalhando com Listas

Lista não ordenadaLista ordenadaListas aninhadasRecapitulação - Listas

6Layout da Página

DivisõesSpans InlineTags SemânticasSeções e ArtigosRecapitulação - Layout

9Formulários e Inputs Parte 2

Radio ButtonsCheckboxesDropdownsBotõesBotões em FormuláriosRecapitulação - Formulários #1Recapitulação - Formulários #2

12Desafios Finais

Cartão de Perfil SimplesCartão de Convite de EventoPágina de Artigo SimplesLista de Livros Favoritos