feed twitter facebook LinkedIn facebook

HTML » Alto y ancho de una imagen con HTML

diciembre 4, 2007 por Víctor Cuervo 7 Comentarios Imprimir Imprimir

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.

La etiqueta 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:

  1. <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 100x100 pixels, la línea de código quedaría de la siguiente forma:

  1. <IMG src="mifoto.jpg" width="100" height="100"/>
Visualizar el Codigo
Visualiza el artículo
Descargar el Codigo
Descargar el código
Error en el Codigo
Error en el código
Foro sobre HTML
Foro sobre HTML
tags: , , , , , ,

Artículos relacionados:

7 comentarios »

RSS feed para los comentarios de esta entrada. TrackBack URI

  1. Daniell
    marzo 31, 2008 #

    Hola. ps es genial eh tienen todos los Scrips que necesito, no duden que voy a recomdar esta pagina , es genial en pocas palabras ps gracias y adeos me despido .. Adeos..

  2. anonimo
    junio 22, 2009 #

    Hay que tener en cuenta, que si la imagen original pesa 1 Mb por ejemplo, y la muestrar a 100×100 pixels , sigue pesando igual, seria conveniente optimizarla a un tamaño menor.

  3. lineadecodigo
    junio 22, 2009 #

    @anonimo,

    Esa apreciación es muy buena. No por especificar el tamaño de la imagen reducimos el tamaño de esta. Y, efectivamente, si pesa 1Mb, seguirá pensando 1Mb.

    Por lo tanto, aunque indiquemos el alto y el ancho es bueno tener imágenes optimizadas y que pesen poco.

    Ahora, que también es una buena práctica definir el alto y el ancho de cara a la optimización del navegador.

  4. yo
    octubre 20, 2010 #

    jajajcomo es que se le aplica eiquetasa sintaxis y atributios para insertar imagen je

  5. erick
    noviembre 16, 2010 #

    como puedo manipular, cambiar el ancho y alto de una imagen desde un fromulario mediante me explico introducir eso 100 mediante un fromulario en una variable w=100 h=100 algo asi den me una ayuda porfavor

  6. erick
    noviembre 16, 2010 #
  7. Etiquetas HTML | natalianrn
    mayo 18, 2014 #

    […] recuperado: 14/05/2014 http://lineadecodigo.com/html/alto-y-ancho-de-una-imagen-con-html/ […]

Deja un comentario

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

*