Artículos
HTML

Alto y ancho de una imagen con HTML

04/Dic/2007

Cuando aprendemos a escribir lenguaje HTML para crear nuestras páginas web aguantaremos poco creando páginas web con solo texto y estaremos deseosos de insertarle alguna imagen para darlas colorido.

El elemento HTML que nos permite poner imágenes en nuestra página web es img. La línea de código que necesitaríamos sería la siguiente:

<img src="mifoto.jpg" />

Vemos que el atributo src permite indicar el nombre de la imagen que queramos cargar. Este nombre puede ser directamente el de la imagen o bien una ruta relativa o absoluta más el nombre de la imagen.

Por defecto, el tamaño de la imagen que carga es su tamaño original.

Si queremos modificar el tamaño deberemos de utilizar los atributos HTML width y height, los cuales nos permiten modificar el ancho y el alto de la imagen respectivamente. A estos atributos les tendremos que dar unos valores numéricos que indiquen el valor en pixels que queremos reflejar.

Así, si queremos poner la imagen a 100×100 pixels, la línea de código quedaría de la siguiente forma:

<img src="mifoto.jpg" width="100" height="100" />

De esta forma tan sencilla hemos podido definir el alto y ancho de una imagen con HTML utilizando los atributos del elemento img. Ahora un reto, ¿sabrías como puedes conseguir lo mismo pero haciendo uso del lenguaje CSS? ¿Son válidas las dos alternativas cuando queremos manejar el alto y el ancho o solo una es la correcta? Te lo contamos en el artículo Definir el tamaño de una imagen con CSS.

Código Fuente

Descárgate el código fuente de Alto y ancho de una imagen con HTML
Y si te ha gustado nuestro código fuente puedes regalarnos una estrella Star
Alto y ancho de una imagen con HTML

Vídeos sobre HTML

Disfruta también de nuestros artículos sobre HTML en formato vídeo. Aprovecha y suscribete a nuestro canal.

Test HTML

¿Te atreves a probar tus habilidades y conocimiento en HTML con nuestro test?

Test HTML
Suscribir
Notificar de
guest
51 Comentarios
Recientes
Anteriores Más votados
Opiniones integradas
Ver todos los comentarios