Menu
CoddyTech
Empezar a aprender

Foto de Perfil

Parte de la sección Fundamentos del Journey de HTML de Coddy. Lección 32 de 60.

challenge icon

Desafío

Fácil

¡Muy bien, es hora de añadir la foto de perfil! Puedes usar cualquier imagen que quieras. Siéntete libre de usar el enlace del ejemplo de abajo.

  1. Después del primer div (la sección del encabezado), crea otro <div>. Dentro, añade una etiqueta <img>.
  2. Configura src para que enlace a tu imagen y usa los atributos width y height para controlar su tamaño.

Por ejemplo:

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

Pruébalo tú mismo

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

Todas las lecciones de Fundamentos

1Fundamentos de HTML

¿Qué es HTML?Estructura básica de HTMLEtiquetas y elementosAnidamiento y cierre de etiquetasComentarios en HTML

4Tarjeta de receta

Descripción general del proyectoTítulo y descripción de la recetaLección de proyectoIngredientesLección de proyectoPasosLección de proyecto

7Página de Perfil Personal

Descripción General del ProyectoSección de EncabezadoLección de proyectoFoto de PerfilLección de proyectoSección Sobre MíLección de proyectoEnlaces a Redes SocialesLección de proyecto

10Tablas

Conceptos básicos de tablasAñadir leyendasCombinar filas y columnasResumen - Tablas

2Texto y formato

EncabezadosPárrafosSaltos de líneaTexto en negrita y cursivaNegrita y cursiva de nuevoResumen - Formato

5Agregar contenido

Atributos HTMLEnlacesEnlaces a una nueva páginaImágenesAtributos de imagen

8Formularios e Inputs Parte 1

Conceptos básicos de formulariosInputs de textoAtributos de los inputsCampo de contraseñaEtiquetas para inputsResumen - Formulario básico

11Página de registro de eventos

Descripción general del proyectoSección del encabezadoLección de proyectoSección de detalles del eventoLección de proyectoFormulario de registroLección de proyectoSección del pie de páginaLección de proyecto

3Trabajando con listas

Lista desordenadaLista ordenadaListas anidadasResumen - Listas

6Diseño de página

DivisionesSpans en líneaEtiquetas semánticasSecciones y artículosRepaso - Diseño

9Formularios e Inputs Parte 2

Radio buttonsCheckboxesDropdownsBotonesBotones en formulariosRepaso - Formularios #1Repaso - Formularios #2

12Desafíos finales

Tarjeta de perfil sencillaTarjeta de invitación a eventoPágina de artículo sencillaLista de libros favoritos

Practica por tu cuenta: Playground de Web