Share your repls and programming experiences

← Back to all posts
Ejercicio 4
Ismaelpc (3)

Desarrollo ejercicio 4
Vamos a trabajar fuera de esta página
Aquí arriba ves que pone my repls pulsas ahí, te lleva a la página de inicio, a la derecha en azul pone +new rpl , pulsa y se abrirá una ventana eliges HTML, CSS, JS,cambias el nombre de archivo absurdo, por Ejercicio 4, y me pegas la dirección que os aparece en la barra de direcciones, en la parte izquierda de esta página, como un enlace de la manera que hemos aprendido en el Ejercicio 3 y cuando pulse me lleve al Ejercicio 4 (vídeo parte 1)

Una vez en la página del Ejercicio 4 (vídeo parte2)

Copiamos y pegamos el Ejercicio 3 que no sirva de base
Una vez que ya lo tenemos vamos a insertar varias imágenes
La etiqueta es <img> No tiene cierre, dentro de ella ponemos la ruta de la imagen de manera obligatoria y el tipo de imagen, jpg, png, etc.
<img src = “rutadelaimagen.tipo”> Volvemos a ver lo de la ruta relativa o absoluta, si la imagen la hemos subido nosotros la ruta es relativa, es la ruta que tiene que seguir el navegador desde donde está la página archivada hasta el lugar donde está la imagen archivada.
<img src = “koala.jpg”>
<img src = “/imagenes/koala.jpg”> En este caso está en una carpeta llamada imágenes que está alojada en la misma carpeta que la página
Para imágenes fuera del propio ordenador
<img src="https://www.example.com/images/dinosaur.jpg"> si la imagen es externa alojada en una página web o un servidor
Observad en el vídeo que no copio la dirección de la página que acaba en .html sino la que acaba en .jpg, que es formato de imagen

Opcionalmente alt= “explicación imagen” Por si un navegador tuviera problemas en mostrarla
Opcionalmente width =”400.px” De esta manera ajusta la anchura de la imagen
Opcionalmente height =”200.px” De esta manera ajusta la altura de la imagen

Estas últimas suelen ser necesarias para ajustar la imagen a la web, puede ponerse px de pixel o en %. Una Imagen con width="50%" se ajusta a la mitad de su tamaño