Autor Tema: Formularios HTML. Botones: submit, reset, imagen y contenido. CU00724B (Leído 2491 veces)

LuisM · « **en:** 20 de Octubre 2017, 02:48 »

Hola a todos !! Paso a dejar el código de etiquetas HTML que se propone en el ejercicio CU00724B del curso básico de programador web. Desde ya muchas gracias. Saludos
Luis

EJERCICIO

Crea una página web que contenga dos formularios que cumplan estas condiciones.

Como título antes del primer formulario debe figurar con etiquetas h1 el texto <<Inscripción al concurso Saber y Ganar>>. Debe contener:
a) Nombre
b) Apellidos
c) email
d) Teléfono
e) Un botón submit para enviar que muestre el texto <<¡¡¡Me apunto!!!>> y un botón reset para restablecer que muestre el texto <<Cancelar>>.

Como título antes del segundo formulario debe figurar con etiquetas h1 el texto “Petición de información”. Debe contener:
a) Nombre
b) País
c) email
d) Consulta que se quiere realizar (debe ser un textarea que permita escribir múltiples líneas).
e) Un botón para enviar de tipo imagen y un botón para restablecer de tipo button que muestre dentro del botón lo siguiente: <<Pulse aquí para cancelar>>, un salto de línea, y el texto <<Esto borrará los datos>>.

Código: [Seleccionar]

<!DOCTYPE html>
<html>
    <head>       
        <meta charset="utf-8">
        <title>Inscripción al Congreso de Medicina Santiago 2048</title>
    </head>
<body>
<form action="https://www.aprenderaprogramar.com" method="get">
<h1>Inscripción al concurso Saber y Ganar</h1>
<p>
<label for="nombre1">Nombre: </label>
<input type="text" name="nombre1" id="nombre1" />
<br/> 
<label for="apellido">Apellido: </label>
<input type="text" name="apellido" id="apellido" />
<br/> 
<label for="email1">email: </label>
<input type="text" name="email1" id="email1" />
<br/> 
<label for="telefono">Teléfono: </label>
<input type="text" name="telefono" id="telefono" />
<br/> <br/> 
<input type="submit" value="¡¡¡Me apunto!!!" />
<input type="reset" value="Cancelar" />
</p>
</form>
<form action="https://www.aprenderaprogramar.com" method="get">
<h1>Petición de información</h1>
<p>
<label for="nombre2">Nombre: </label>
<input type="text" name="nombre2" id="nombre2" />
<br/> 
<label for="pais">Pais: </label>
<input type="text" name="pais" id="pais" />
<br/> 
<label for="email2">email: </label>
<input type="text" name="email2" id="email2" />
<br/> 
<textarea name="consulta" rows="3" cols="40">...Consulta que se quiere realizar...</textarea>
<br/> 
 <input name="boton" type="image"
  src="/images/aprenderaprogramar/imagen.png">
<br/> <br/>
<input type="reset" value="Pulse aquí para cancelar" />
<br/>
Esto borrará los datos
</p>
</form>
</body>
</html>

LuisM · « **Respuesta #1 en:** 20 de Octubre 2017, 15:36 »

No aparece una imagen, ahora si con este nuevo código

Código: [Seleccionar]

<!DOCTYPE html>
<html>
    <head>       
        <meta charset="utf-8">
        <title>Inscripción al Congreso de Medicina Santiago 2048</title>
    </head>
<body>
<form action="https://www.aprenderaprogramar.com" method="get">
<h1>Inscripción al concurso Saber y Ganar</h1>
<p>
<label for="nombre1">Nombre: </label>
<input type="text" name="nombre1" id="nombre1" />
<br/> 
<label for="apellido">Apellido: </label>
<input type="text" name="apellido" id="apellido" />
<br/> 
<label for="email1">email: </label>
<input type="text" name="email1" id="email1" />
<br/> 
<label for="telefono">Teléfono: </label>
<input type="text" name="telefono" id="telefono" />
<br/> <br/> 
<input type="submit" value="¡¡¡Me apunto!!!" />
<input type="reset" value="Cancelar" />
</p>
</form>
<form action="https://www.aprenderaprogramar.com" method="get">
<h1>Petición de información</h1>
<p>
<label for="nombre2">Nombre: </label>
<input type="text" name="nombre2" id="nombre2" />
<br/> 
<label for="pais">Pais: </label>
<input type="text" name="pais" id="pais" />
<br/> 
<label for="email2">email: </label>
<input type="text" name="email2" id="email2" />
<br/> 
<textarea name="consulta" rows="3" cols="40">...Consulta que se quiere realizar...</textarea>
<br/> 
 <input name="boton" type="image"
  src="https://i.imgur.com/xfchX9O.png">
<br/> <br/>
<input type="reset" value="Pulse aquí para cancelar" />
<br/>
Esto borrará los datos
</p>
</form>
</body>
</html>

Ogramar · « **Respuesta #2 en:** 29 de Enero 2018, 17:55 »

Buenas LuisM

En etiquetas sin cierre explícito como <meta charset="utf-8"> recomendamos introducirlo así: <meta charset="utf-8" /> para cumplir el estándar XHTML.

En el textarea has introducido dentro del textarea lo que se supone era el texto indicando el contenido del textarea, es decir, igual que ponías Nombre: , País: , etc. tenía que ponerse Consulta que se quiere realizar:

Sin embargo al poner
<textarea name="consulta" rows="3" cols="40">...Consulta que se quiere realizar...</textarea>

se ve el texto dentro del textarea. No tiene demasiada importancia porque al fin y al cabo se entiende.

El botón para cancelar no muestra dentro el texto "Esto borrará los datos" (se supone que debía mostrarse dentro del botón ya que el ejercicio dice un botón para restablecer de tipo button que muestre dentro del botón lo siguiente: <<Pulse aquí para cancelar>>, un salto de línea, y el texto <<Esto borrará los datos>>. )

Salu2

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: