Autor Tema: Crear pequeña maquetación HTML asemejable a portal web Ejercicio CU00727B curso  (Leído 2208 veces)

Dimitar Stefanov

  • Experto
  • *****
  • Mensajes: 598
    • Ver Perfil
Y aquí viene mi código al ejercicio CU00727B:

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ejemplo de divs</title>
</head>
<body>
<div id="page">
<div id="header">
<img src="imagen.png" alt="logotipo01">
<h1>Aprender a programar</h1>
<a href="http://aprenderaprogramar.com" target="_blank"><img src="logonotplusplus.png" alt="logotipo02" title="Pulse aquí para aceder a www.aprenderaprogramar.com"></a>
</div>
<br/><br/><br/>
<div id="wrapper">
<div id="menu">
<div>Menu</div>
<ul>
<li>Inicio</li>
<li>Cómo empezar</li>
<li>Libros</li>
<li>Cursos</li>
<li>Empleo</li>
</ul>
</div>
<div id="body">
<img src="logo.jpg" alt="logotipo03" title="Crimson Editor">
<p>
Al hablar de fundamentos de programación nos referimos a aquellos conocimientos básicos que nos permitirán desenvolvernos sin excesivo número de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un símil de transporte. El conductor (programador) dispone de un coche (el ordenador) y desea trasladarse.
</p>
<p>
Al hablar de fundamentos de programación nos referimos a aquellos conocimientos básicos que nos permitirán desenvolvernos sin excesivo número de tropiezos. Veamos a qué tipo de tropiezos nos referimos utilizando un símil de transporte. El conductor (programador) dispone de un coche (el ordenador) y desea trasladarse.
</p>
</div>
</div>
<br/><br/><br/>
<div id="footer">
<img src="imagen.png" alt="logotipo04" title="aprenderaprogrmar.com">
Copyright 2016-2020.
<a href="http://aprenderaprogramar.com">Aprender a Programar</a>
</div>
</div>
</body>
</html>

Mastermind, ¿por qué en la división <div id="pie"> introduces los elementos mediante la etiqueta <pre> ? ¿Para que se te vean en línea, en vez de, en bloque?
« Última modificación: 15 de Enero 2016, 18:31 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Buenas dimiste lo veo bien

Para que podamos ver las imágenes que incluyes en los ejercicios puedes usar urls de internet en lugar de rutas locales, por ejemplo

En lugar de src="logonotplusplus.png"

Una ruta como src="https://notepad-plus-plus.org/assets/images/folder_download_4.png" ya nos permite a todos poder verla si es una dirección válida de internet

La etiqueta <pre> sirve para que el texto se muestre con los saltos de línea y tal y como lo tengas tú en el archivo.

Salu2

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".