Hola amigos mi consulta es esa necesito mostrar solamente una porcion de una imagen . Hay alguna forma de especificar que parte de la imagen se vea? usando css o no se si la etiqueta img tiene algunos parametros para dicho caso. Si alguno sabe seria de gran ayuda gracias :).
-
1Qué es lo que has intentado hasta hora?– Jheyman MejiaCommented el 21 nov. 2019 a las 18:43
-
bueno probe con background-position pero con las pripiedades top center bottom– george delaselvaCommented el 21 nov. 2019 a las 18:45
-
Si te ha servido alguna de las respuestas deberías marcarla como aceptada.– user7176Commented el 22 nov. 2019 a las 7:08
Añade un comentario
|
2 respuestas
existe la propiedad background-position
en CSS, la cual te permite colocar la imagen, segun las coordenadas que le indiques.
.img{
height: 75px;
width: 75px;
background: url("https://media.istockphoto.com/vectors/contact-info-icon-vector-id889473166?k=6&m=889473166&s=612x612&w=0&h=L8ak00zJlTx4XaJ6dpEVBNuSgrY9hfH0t0pCCeud11Y=");
background-position: -55px -25px;
}
<div class="img">
</div>
Como ves, la imagen es una imagen llena de iconos, y en el ejemplo solo se muestra 1.
A mi contenedor div.img
, le coloque un tamaño con width
y height
para conseguir el objetivo
El primer valor mueve de derecha a izquierda y el segundo de arriba a abajo
-
gracias amigo creo que esto es lo que busco Commented el 21 nov. 2019 a las 18:46
Puede que esto te sirva:
<!DOCTYPE html>
<html>
<head>
<style>
img {
width: 200px;
height: 600px;
object-fit: cover;
object-position: 30% 5%;
}
</style>
</head>
<body>
<h2>Image</h2>
<img src="paris.jpg" alt="Paris">
</body>
</html>
Para mover puedes cambiar los valores de object position.
La probe con la siguiente imagen:
-
gracias por responder amigo. Lo voy a probar aver que tal de momento pareciera que puede servir. Commented el 21 nov. 2019 a las 18:27