ejemplo de código de relación de aspecto de imagen css

Esta es la respuesta más exacta que te podemos dar, pero obsérvala pausadamente y valora si se adapta a tu trabajo.

Ejemplo 1: ajuste de imagen css en div con relación de aspecto

img 
    width: 100%;
    height: 100%; 
    object-fit: contain;

Ejemplo 2: mantener la relación de aspecto de la imagen css

img 
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;

Ejemplo 3: css mantener la relación de imagen

img 
  object-fit: cover;
  width: 100px;
  height:100px;

Ejemplo 4: conservar la relación de aspecto de la imagen css

/* Simply add width without height,
aspect ratio will be maintained 
and height will be calculated accordingly*/

img 
  width: 100px;

Ejemplo 5: css mantener imagen de relación de aspecto

.image-full 
    background: url(...some image...) no-repeat;
    background-size: cover;
    background-position: center center;

Ejemplo 6: relación de aspecto de mantenimiento de imagen html

Don't set height AND width. Use one or the other and the correct aspect ratio will be maintained.

Puedes proteger nuestra labor ejecutando un comentario y valorándolo te estamos agradecidos.

---

---

Utiliza Nuestro Buscador