Programaclic

9. CSS: ancho y alto (propiedades 'width' y 'height')

Ratón de ordenador

Continuamos cambiando tamaños; ahora modificaremos la anchura y la altura de una imagen. Para ello tenemos que trabajar con las propiedades width y height. Observa este ejemplo en código CSS:

img {

width: 128px;

height: 92px;

}

Una de las unidades más utilizadas para definir la altura y la anchura de las imágenes es el pixel, pero también puedes modificar el tamaño usando porcentajes, por ejemplo.

¡Ahora te toca a tí!

Vamos a cambiar el tamaño de la imagen de Musy, en la parte superior de la página. Esta vez utilizaremos dos propiedades, así que atentos a cómo debemos escribir la regla:

img {width: 128px; height: 92px;}

Te proponemos las siguientes opciones:

Después activa el botón 'Comprobar' para ver cómo queda la página. Puedes probar con todas las opciones, si lo deseas. Si no te funciona, fíjate bien en cómo has escrito la regla: con los nombres de los colores bien escritos, los espacios en blanco, el punto y coma, para separar las propiedades, etc.

Volver al juego