fbpx
Volver a Curso

Curso profesional de HTML y CSS.

0% Completado
0/0 Steps
  1. Antes de empezar el curso.

    Grupos y foros.
  2. Módulo 1 - Desarrollo web
    1.1 Sitios Web
    4 Temas
    |
    1 Cuestionario
  3. 1.2 Lenguajes
    4 Temas
    |
    1 Cuestionario
  4. 1.3 Herramientas
    3 Temas
  5. Módulo 2 - HTML
    2.1 Estructura
    5 Temas
    |
    1 Cuestionario
  6. 2.2 Contenido
    6 Temas
    |
    1 Cuestionario
  7. Descargar material 1
  8. Módulo 3 - CSS
    3.1 Estilos
    2 Temas
  9. 3.2 Referencias
    2 Temas
  10. 3.3 Propiedades
    12 Temas
    |
    1 Cuestionario
  11. 4.1 Cajas
    1 Tema
    |
    1 Cuestionario
  12. Módulo 4 - Diseño web
    4.2 Modelo de caja tradicional
    4 Temas
    |
    1 Cuestionario
  13. 4.3 Modelo de caja flexible
    2 Temas
    |
    1 Cuestionario
  14. 5.1 Web móvil
  15. Despedida del curso
  16. Descargar material 2
  17. Descargar material 3
  18. Módulo 5 - Diseño web adaptable
    Proyecto 1 - Netflix
    13 Temas
  19. Final del curso
    Proyecto 2 - Azul Web
    6 Temas
  20. Proyecto final
    2 Temas
  21. Encuesta
Lección 5, Tema 4

Elementos estructurales parte 2

Angel Sánchez 7 octubre, 2024
Lección Progreso
0% Completado

💸 ¡Impulsa tu carrera en programación!

Descubre nuestros cursos gratuitos con certificación y aprovecha el soporte excepcional que ofrecemos a través de nuestros foros. Al unirte, no solo adquirirás nuevos conocimientos, sino que también formarás parte de una gran comunidad de aprendizaje comprometida y apasionada. ¡Comienza hoy mismo tu viaje en Azul School!

Otro elemento que es muy importante dentro de nuestra cabecera es el elemento <link>, se usa para incorporar al documento estilos, códigos, imágenes o iconos desde archivos externos. En este ejemplo vamos a cargar el icono de nuestra página web. 

<!DOCTYPE html>
<html lang="es">
<head>
     <title>Este texto es el título del documento</title>
     <meta charset="utf-8">
     <link rel="icon" href="img/favicon.png" type="image/png" sizes="16x16">
</head>
<body>
</body>
</html>

El elemento <link> también se utiliza para cargar archivos externos, ya sea archivos css o js.

<!DOCTYPE html>
<html lang="es">
<head>
     <title>Este texto es el título del documento</title>
     <meta charset="utf-8">
     <link rel="icon" href="img/favicon.png" type="image/png" sizes="16x16">
     <link rel="stylesheet" href="css/style.css">
</head>
<body>
</body>
</html>

Archivo index.html usado en el video.

<!DOCTYPE html>
<html lang="es">
	<head>
		<title>Mi primera pagina web.</title>
		<meta charset="utf-8">
	</head>
	<body>	
		<div id="boton">
			<p>Hola, soy un boton.</p>
		</div>
		<script>
			document.getElementById("boton").style.background = "#2C1D1D";
		</script>
	</body>
</html>

Archivo style.css usado en el video.

#boton{
	background: #EC4E82;
	color: #ffffff;
}