Temas > Programacion > Html > Imagenes dentro de una pagina en html
Julio

Imágenes dentro de una página <img>
Para insertar una imagen dentro de una página debemos utilizar el elemento
HTML <img>, la misma no tiene una marca de finalización (similar a la
marca <br>).
Generalmente, la imagen se encuentra en el mismo servidor donde se
almacenan nuestras páginas HTML. Los formatos clásicos son los archivos
con extensiones gif, jpg y png.
La sintaxis de esta marca es:
<?php //esto no va
<img src="foto1.jpg" alt="Pintura geométrica">
?>//esto no va
Como mínimo, debemos inicializar las propiedades src y alt de la marca
HTML img.
En la propiedad src indicamos el nombre del archivo que contiene la imagen
(en un servidor Linux es sensible a mayúsculas y minúsculas por lo que es
recomendable que siempre se utilicen minúsculas para los nombres de
archivos).
Como la imagen se encuentra en el mismo directorio donde se almacena la
página HTML, con indicar el nombre de archivo basta (no es necesario
indicar ninguna ruta de carpetas).
Otra propiedad obligatoria es alt, donde disponemos un texto que verán los
usuarios que visiten el sitio con un navegador que sólo permite texto (o
con un navegador que tenga desactivada la opción de descarga de
imágenes). El texto debe describir el contenido de la imagen.
Confeccionemos una página que muestre una imagen llamada foto1.jpg (La
imagen se encuentra almacenada en el servidor en la misma carpeta donde se
localiza esta página).
<?php //esto no va
<html>
<head>
</head>
<body>
<img src="foto1.jpg" alt="Pintura geométrica">
</body>
</html>
?>//esto no va
Si la imagen se encuentra en una subcarpeta llamada imagenes, luego la
sintaxis para recuperarla será:
<?php //esto no va
<img src="imagenes/foto1.jpg" alt="Pintura geométrica">
?>//esto no va
Es decir, antecedemos al nombre de la imagen el nombre de la carpeta y la
barra /.
Si la imagen se encuentra en una carpeta padre de donde se encuentra la
página HTML luego la sintaxis será:
<?php //esto no va
<img src="../foto1.jpg" alt="Pintura geométrica">
?>//esto no va
Es decir, le antecedemos .. y la barra / al nombre de la imagen
Si queremos subir dos carpetas luego escribimos:
<?php //esto no va
<img src="../../foto1.jpg" alt="Pintura geométrica">
?>//esto no va
Por último, si queremos acceder a una imagen que se encuentra en una
carpeta llamada imagenes pero que está al mismo nivel:
<?php //esto no va
<img src="../imagenes/foto1.jpg" alt="Pintura geométrica">
?>//esto no va
Primero le indicamos que subimos al directorio padre mediante los dos
puntos .. y seguidamente indicamos el nombre de la carpeta y la imagen a
mostrar.
<img> viene de image
src viene de source
alt viene de alternative













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google




LunMarMieJueVieSabDom
    123
45678910
11121314151617
181920 21222324
252627282930 

Jueves 21 de Noviembre 2024
Semana 47

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal
Rechazar    Aceptar