Cómo crear Div Para recortar una imagen en CSS

La propiedad "desbordamiento" en el CSS o Cascading Style Sheets, le dice al navegador qué hacer con el contenido que es más grande que el tamaño de su elemento contenedor; puede establecer el desbordamiento de "scroll" para las barras de desplazamiento o "oculto" para recortar el contenido desborda. Crear un div que se envuelve alrededor de una imagen, ajustar el div a un cierto tamaño y decirle al navegador para no mostrar partes de la imagen que quedan fuera de las líneas invisibles de la div.

Instrucciones

1 Abra la página Web en el Bloc de notas o un editor de código para que puedas ver y editar su código. Busque la imagen que desea recortar en el código:

<Img alt = "Mi imagen" />

2 Añadir un conjunto de "<div>" etiquetas alrededor de su imagen. Dar a la nueva div un nombre de ID:

<Div id = "cultivo"> ​​<img alt = "Mi imagen" /> </ div>

3 Busque el "<style>" etiquetas en la cabecera de su código de la página web o añadirlos a continuación los "<title>" etiquetas:

<Style type = "text / css">

</ Style>

Añadir su código CSS entre los "<style>" etiquetas.

4 Escribe este código para recortar una imagen dentro de un div:

{cultivo

Anchura: 100px;

altura: 100px;

sobrecarga oculta;

}

Cambiar "cultivo" al nombre de ID de su div. Debe establecer al menos una anchura o altura, o ambos, para recortar la imagen. Ajuste "overflow: hidden" para cortar la imagen dondequiera que vaya fuera de los límites de la div.