HTML nos permite usar imágenes en páginas web y hacerlas más atractivas aplicando diferentes estilos. Si necesita cambiar la relación de aspecto de la imagen o su imagen no se ajusta a su diseño de página web, puede cambiar su tamaño. Para este propósito, puede utilizar el "ancho" y "altura"Propiedades en el"img" etiqueta. Estos valores de propiedad se pueden establecer fácilmente en píxeles CSS.

En este manual, aprenderá el método para cambiar el tamaño de la imagen en HTML.

Antes de comenzar, se requiere agregar la imagen al archivo HTML sobre el cual se realizará la operación del cambio de tamaño de la imagen.

Cómo incrustar una imagen en HTML?

Para agregar una imagen en HTML, use la siguiente sintaxis:

La descripción de la sintaxis mencionada anteriormente se describe a continuación. El "img"La etiqueta usa dos atributos:

• • "SRC" se usa para proporcionar la ruta (URL) de la imagen.
  • "Alt" se usa para proporcionar el texto alternativo si no se muestra la imagen.

Html

El siguiente código representa dos divs. En el primer div, agregamos un encabezado en el centro superior de nuestra página web como "Tamaño de imagen en html"Al usar el

etiqueta:

Tamaño de imagen en html

El segundo div se agrega con la clase llamada "envase"Y para representar la imagen en el centro, hemos usado la etiqueta. Dentro del centro, escriba el código mencionado a continuación para agregar una imagen:

La imagen seleccionada con "640*437"La relación de aspecto se verá así:

La siguiente sección demostrará el método para cambiar el tamaño de una imagen.

Cómo cambiar el tamaño de la imagen en HTML?

Puede personalizar el tamaño de la imagen o cambiarla utilizando "ancho" y "altura"Atribues para establecer su ancho y altura.

Ahora, establezcamos el valor de ancho de la imagen agregada como "300"Y vea cómo funciona:

Se puede ver que el ancho de la imagen ha cambiado y se redimensiona con éxito:

Además del ancho, el "alturaEl atributo también se puede utilizar para el mismo propósito. Para ver la diferencia de tamaño, establezca "550"Píxeles como altura de la imagen:

Puede observar claramente la diferencia en el tamaño de la imagen:

Así es como se usan los atributos de ancho y altura para cambiar el tamaño de la imagen.

Conclusión

En HTML, el "altura" y "anchoLos atributos se utilizan para cambiar el tamaño de la imagen. Puede cambiar la relación de aspecto predeterminada de la imagen agregada configurando los valores de estos atributos. Como resultado, se puede ver una clara diferencia con respecto al tamaño de la imagen. Este blog ha demostrado el método para usar propiedades de altura y peso para cambiar el tamaño de las imágenes en HTML.