Autor Tema: EJERCICIO CU00726B curso HTML desde cero div y span capas o contenedores  (Leído 5903 veces)

borri_10

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 31
    • Ver Perfil
Código: [Seleccionar]
<html>
<head>
<meta charset="utf-8">
<title> Ejercicio CU00726B </title>
</head>
<body>
<div style="border: 1px solid black";">
<h1> Portal web aprenderaprogramar.com </h1>
<br/>
<br/>
<h2> Didactica y divulgacion de la programacion </h2>
<br/>
<br/>
<br/>
Menú<br/>
</div>
<hr style="2px" blackground-color="black"" color="black">
<div style="border: 1px solid black;">
<ul>
<li><a href="http://aprenderaprogramar.es/index.php?option=com_content&view=frontpage&Itemid=46" target="_blank">Inicio</a></li>
<li><a href="http://aprenderaprogramar.es/index.php?option=com_content&view=section&layout=blog&id=7&Itemid=26" target="_blank"> Libros de programacion</a></li>
<li><a href="http://aprenderaprogramar.es/index.php?option=com_content&view=article&id=57&Itemid=86" target="_blank"> Cursos de programacion</a></li>
<li><a href="http://aprenderaprogramar.es/index.php?option=com_content&view=section&layout=blog&id=10&Itemid=48" target="_blank">Humor Informatico</a></li>
</ul>
<br/>
<p> Aprender a programar es un objeto que se plantea mucha gente y que no todos alcanzan.
<br/>
Hay que tener claro que <a href="http://aprenderaprogramar.es/" target="_blank">aprender a programar</a> no es tarea de un dia ni de una semana, aprender
programacion requiere al menos varios meses y, si hablamos programacion a nivel profesional, varios
años. No queremos con esto desanimar a nadie: en un plazo de unos pocos dias podemos estar haciendo
nuestros primeros programas.</p>
<br/>
<p>Puedes seguir uno de <a href="http://aprenderaprogramar.es/index.php?option=com_content&view=article&id=57&Itemid=86" target="_blank">nuestros cursos</a> entre los varios disponibles. Cuando haya que utilizar un editor de
textos recomendamos el uso potente y sencillo como Notepad++, aunque son válidas otras
alternativas como Crimson Editor.</p>
<img src="http://upload.wikimedia.org/wikipedia/commons/0/0f/Notepad%2B%2B_Logo.png" width="100px"><img src=" http://www.crimsoneditor.com/images/logo.jpg" width="100px">
<br/>
Si quieres contactar con nosotros envianos este formulario relleno:
<form method="post" action="http://aprenderaprogramar.com/action.php">
<label for="nombre">Nombre:</label>
<input type="text" name="nombre" id="nombre">
<br/>
<label for="apellidos">Apellidos:</label>
<input type="text" name="apellidos" id="apellidos">
<br/>
<label for="direccion">Direccion:</label>
<input type="text" name="direccion" id="direccion">
<br/>
<label for="correo electronico">Correo Electronico</label>
<input type="text" name="correoelectronico" id="correoelectronico" size="5">
<br/>
<br/>
<br/>
Mensaje:<br/><br/>
<input type="submit" value="Enviar">
<input type="reset" value="Cancelar">
</form>
<br/>
<br/>
<img src=" http://empleo.fedecarne.es/resources/logos_emp/Logo_128737.png" width="200px"><a href="http://aprenderaprogramar.es/index.php?option=com_content&view=article&id=28&Itemid=73"</a>
Copyright 2006-2038 aprenderaprogramar.com
</div>
</body>
</html>
« Última modificación: 04 de Marzo 2015, 08:40 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2662
    • Ver Perfil
Hola el ejercicio está bastante bien. Te señalo las cosas a mejorar:

<div style="border: 1px solid black";">

le sobran unas comillas, las tienes duplicadas

el ; iría después de black y antes de las comillas, así: <div style="border: 1px solid black;">


<hr style="2px" blackground-color="black"" color="black">


No es blackground sino background y a un elemento hr no le puedes aplicar background-color

Has escrito "black"" y ahí te sobran unas comillas


En <p> Aprender a programar es un objeto que se plantea mucha gente y que no todos alcanzan.
<br/>

No debes poner elementos <br/> dentro de <p>. Si quieres crear un salto de línea, cierra con </p> y vuelve a crear otro párrafo.

En los elementos img conviene poner alt y title

La estructura html está bastante bien, para mejorar la presentación (css): http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=75&Itemid=203

Salu2!

borri_10

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 31
    • Ver Perfil
Lo que no entiendo muy bien es lo de "alt", cuando hay que ponerlo y porque. Es un concepto que me cuesta entenderlo y saber porque se usa.
No se si me lo puedes explicar en plan rapido...

Gracias y saludos,

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2662
    • Ver Perfil
Hola alt significa "texto alternativo" y será el texto que se muestre en caso de que la imagen no se pueda cargar (si un archivo está dañado, si no se puede conectar con el servidor o equipo donde se encuentra el archivo, etc). No es obligatorio incluirlo, pero es recomendable. También puede ser útil para el rastreo por parte de buscadores.

Salu2

jimmorrison

  • Principiante
  • **
  • APR2.COM
  • Mensajes: 51
  • la programacion es vida
    • Ver Perfil
aqui esta el mio corrijan todo por fas maestros

Código: [Seleccionar]
<!Doctype html>
<html lang="es">
<head>
<title>aprendiendo a programar html</title>
<meta charset="charset utf-8">
<meta name="description" content="tutorial de aprendiendo a porgramar en html">
<meta name="keywords" content="html aprender html curso tutorial">
<head>

<body>
<div id="cuerpo" style="border: 1px solid black;">
<header>   
<h1>Portal web aprendiendoaprogramar.com</h1>
<h2>Didactica y divulgacion de la programacion </h2>
</header>

<nav id="menu">
<p>Menu</p>
<hr style="color: black;" width="98%">
<ul>
<li><a href="#inicio">inicio</a></li>
<li><a href="#libros">libros de programacion</a></li>
<li><a href="#cursos">cursos de programacion</a></li>
<li><a href="#humor_informatico">humor informatico</a></li>
</ul>
</nav>

<seccion>
<article>
<p>Aprender a programar es un objetivo que se plantea mucha gente y que no todos alcanzan.
<br> <br>
Hay que tener claro que <a href="#aprender_a_programacion">aprender programacion</a> no es

tarea de un dia de una semana: aprender programacion requiere al menos varios meses y, si

hablamos de programacion a nivel profesional, varios años. No queremos con esto desanimar a

nadie: es un plazo de unos pocos dias podemos estar diciendo nuestros primeros programas
<br> <br>
Puede seguir uno de <a href="nuestros_cursos">nuestros cursos</a> entre los varios

disponibles. Cuando haya que utilizar un editor de textos recomendamos el uso de un potente y

sencillo como Notepad++, aunque son validas otras alternativas como Crimson Editor.</p>

<img src="https://encrypted-tbn1.gstatic.com/images?

q=tbn:ANd9GcS8J6o8qrXxFzF2OmFL5yMJ9uzZxMFeI6XUTNV0v3BFl75ukvUkdg" alt="notepad++"

title="notepad++" width="150" height="100">

<img src="C:\Users\Public\Pictures\Sample Pictures/crimson editor.jpg" alt="crimson editor"

alt="crimson editor">
<br>
</article>
<div id="formulario">
<p>Si quieres contactar con nosotros envianos este formulario relleno:</p>
<br>
<form method="post" action="accion.php" enctype="multipart/form-data">
<label for="nombre">nombre :</label>
<input type="text" id="nombre" name="nombre">
<br> <br>
<label for="apellidos">apellidos :</label>
<input type="text" id="apellidos" name="apellidos">
<br> <br>
<label for="direccion">direccion :</label>
<input type="text" id="direccion" name="direccion">
<br> <br>
<label for="email">e-mail :</label>
<input type="email" name="email" id="email">
<br> <br>
<label for="mensaje">Mensaje :</label>
<textarea cols="30" rows="5"></textarea>
</div>
</seccion>
<footer style="text-align: center;">
<img

src="http://lh5.ggpht.com/_PeVwghrmOec/TMkzEonRrcI/AAAAAAAAAHc/IxL8g0fTYtk/an_oliva_png.png"

alt="aprendiendo a programar" title="aprendiendo a programar">
<b><i>Copyright 2006-2038 aprenderaprogramar.com</i></b>
</footer>

</div>
</body>
</html>

javi in the sky

  • Avanzado
  • ****
  • Mensajes: 393
    • Ver Perfil
Saludos morrison

<meta charset="charset utf-8"> está mal, es <meta charset="utf-8">

<seccion> está mal es <section>

Esta ruta está mal src="C:\Users\Public\Pictures\Sample Pictures/crimson editor.jpg" tienes espacios y barras a veces / y a veces \ además es de tu pc no una url por eso la imagen no sale

Te falta cerrar la etiqueta <form>



Antes de dar por terminado el código te recomiendo usar Notepad++ y activar el remarcado de etiquetas, así puedes comprobar si las etiquetas tienen su cierre bien puesto o no.

 ;)

 

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".