Autor Tema: Centrar texto etiqueta center obsoleta Etiquetas HTML básicas: imágenes CU00714B (Leído 6122 veces)

LuisM · « **en:** 15 de Septiembre 2017, 22:26 »

Hola a todos !! paso a dejar el ejercicio propuesto CU00714B del tutorial gratuito de programación HTML de aprenderaprogramar. Desde ya muchas gracias por la atención.
Saludos, Luis

EJERCICIO

Abre cuatro páginas web distintas y captura la ruta de 4 imágenes que puedas encontrar en ellas (las imágenes que prefieras). A continuación crea un documento html donde incorpores un texto que indique el contenido de la imagen y a continuación se vea la imagen. Guarda el documento con un nombre como ejemploCU00714B.html y comprueba que se visualiza correctamente. Ejemplo:

Imagen que refleja una boda:
(… aquí la imagen)
Imagen que muestra un mercado:
(… aquí la imagen)
Imagen que muestra un atleta:
(… aquí la imagen)
Imagen que refleja un atardecer:
(… aquí la imagen)

Código: [Seleccionar]

<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<title>Ejemplo del uso de imágenes - aprenderaprogramar.com</title>
</head>
<body>
Imagen que refleja una boda:
<img src="http://www.agradecimientos.org/wp-content/uploads/2015/01/palabras-de-agradecimiento-de-boda.jpg" alt="imagen boda">

Imagen que muestra un mercado:
<img src="http://guias-viajar.com/wp-content/uploads/2014/05/fotos-valencia-mercado-central-007-450x309.jpg" alt="imagen mercado">

Imagen que muestra un atleta :
<img src="https://sc2.diarioelpais.com/files/article_default_content/uploads/2017/09/10/59b56c1f48598.jpeg" alt="imagen atleta">

Imagen que refleja un atardecer :
<img src="https://miviaje.com/wp-content/uploads/2015/11/shutterstock_255555796.jpg" alt="imagen atardecer">
</body>
</html>

paramonso · « **Respuesta #1 en:** 29 de Noviembre 2017, 10:32 »

Hola LuisM.

El código hace lo que pide el ejercicio pero yo me hubiera esmerado un poco mas
y habría centrado el texto encima de la imagen y la imagen la habría centrado también.
Te dejo el código modificado para que veas el resultado.
Por lo demás todo bien.

Código: [Seleccionar]

<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<title>Ejemplo del uso de imágenes - aprenderaprogramar.com</title>
</head>
<body>
	
<strong><!-- Texto en negrita -->
<center> <!-- Centrado de la imagen --> 
	
<!--      Centrado del texto en cada etiqueta p o en body si lo hacemos
            en body hay que poner el salto de linea <br/> si no se usa la etiqueta <p>.
            Es aconsejable utilizar las etiquetas siempre para que no haya errores.
           -->		
<p align="center">Imagen que refleja una boda:</p>
<img src="http://www.agradecimientos.org/wp-content/uploads/2015/01/palabras-de-agradecimiento-de-boda.jpg" alt="imagen boda">

<p align="center">Imagen que muestra un mercado:</p>
<img src="http://guias-viajar.com/wp-content/uploads/2014/05/fotos-valencia-mercado-central-007-450x309.jpg" alt="imagen mercado">

<p align="center">Imagen que muestra un atleta :</p>
<img src="https://sc2.diarioelpais.com/files/article_default_content/uploads/2017/09/10/59b56c1f48598.jpeg" alt="imagen atleta">

<p align="center">Imagen que refleja un atardecer :</p>
<img src="https://miviaje.com/wp-content/uploads/2015/11/shutterstock_255555796.jpg" alt="imagen atardecer">
</center><!-- Fin Centrado de la imagen --> 
</strong><!-- Fin Texto en negrita -->
</body>
</html>

Un saludo.

LuisM · « **Respuesta #2 en:** 29 de Noviembre 2017, 12:15 »

Oiga !!! póngase en mis zapatos antes de ajusticiarme jaja
Estaba en los primeros pasos de html, si mal no recuerdo se comienza a ver etiquetas en la clase 711 y este ejercicio es de la 714.
1) Etiqueta <center> usada para centrar las imágenes. Creo que no se nombró en todo el curso HTML.
2) Propiedad align (<p align="center" /p>). Texto sacado de la la misma clase CU00714B:"Atributo obsoleto (deprecated). Sustituir por CSS." y la etiqueta <p> se ve recién en la clase siguiente:CU00715B !!!
Por lo tanto me declaro totalmente inocente de culpa y cargo

Muchas gracias por las correcciones.
Un saludo,
Luis

paramonso · « **Respuesta #3 en:** 29 de Noviembre 2017, 13:35 »

Ok LuisM.

El ejercicio estaba bien lo unico que faltaban eran esos dos detalles sin importancia.

Como bien dices no se nombra la etiqueta <center> en todo el curso la he puesto por no complicarme la vida para centrar los gráficos.

Y tienes razón con el align, está obsoleto pero al ser html a palo seco no quise poner nada de css.

Gracias LuisM por tus observaciones
Un saludo

Ogramar · « **Respuesta #4 en:** 07 de Junio 2018, 19:03 »

Buenas, por si alguien lee este hilo, comentar que la etiqueta center está deprecated (obsoleta o desaconsejada). En su lugar se recomienda el uso de técnicas CSS para el centrado de elementos. Las técnicas CSS están explicadas en el curso CSS disponible en https://aprenderaprogramar.com/index.php?option=com_content&view=category&id=75&Itemid=203

Salu2

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

Noticias:

Autor Tema: Centrar texto etiqueta center obsoleta Etiquetas HTML básicas: imágenes CU00714B (Leído 6122 veces)

LuisM

Centrar texto etiqueta center obsoleta Etiquetas HTML básicas: imágenes CU00714B

paramonso

Re:Etiquetas HTML básicas: imágenes. (CU00714B)

LuisM

Re:Etiquetas HTML básicas: imágenes. (CU00714B)

paramonso

Re:Etiquetas HTML básicas: imágenes. (CU00714B)

Ogramar

Re:Centrar texto etiqueta center obsoleta Etiquetas HTML básicas: imágenes CU00714B

Preguntas y respuestas