Foros del Web » Creando para Internet » CSS »

como cambiar el alto de una imagen en bootstrap

Estas en el tema de como cambiar el alto de una imagen en bootstrap en el foro de CSS en Foros del Web. estoy usando por primera vez bootstrap en su vercijon 3.1.. encuentro que para el uso de imagenes usar la clase .img-responsive , esto con el ...
  #1 (permalink)  
Antiguo 28/04/2014, 23:42
Avatar de cristo995  
Fecha de Ingreso: noviembre-2012
Mensajes: 187
Antigüedad: 12 años
Puntos: 0
como cambiar el alto de una imagen en bootstrap

estoy usando por primera vez bootstrap en su vercijon 3.1..
encuentro que para el uso de imagenes usar la clase .img-responsive , esto con el fin para un buen funcionamiento en el responsive designe

para acomodar la imagen a lo ancho no tengo ningun problema ya que esto lo puedo controlar con las columnas asi la imagen tenga un ancho muy grande ps no me da problema ya que se ajusta segun el # de columnas que yo utilize :)..

pero si estoy teniendo problemas con el alto, si mi imagen tiene un alto de 600px
y me gustaria que el alto en mi proyecto fuera de unos 300px no sabria como acomodarla :( e intentado poner un style=height:300px pero eso se me descuadra y no se ve centrada y a la hora del responsive si que peor...

me preguntaba si hay alguna clase en bootstrap que solucione mi problema o sera que me tocara ajustar el tamaño de la imagen con un editor como photoshop ??

seria algo tedios :)
  #2 (permalink)  
Antiguo 29/04/2014, 03:23
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: como cambiar el alto de una imagen en bootstrap

No sé nada de Bootstrap. Supongo que lo que hace con las imágenes para que sean responsive es simplemente añadir un ancho máximo o algo así. Entonces la altura se calcularía automáticamente en base al ancho para no deformar la imagen.

Obviamente si le pones una altura, o bien se deforma, no ocupa su contenedor o bien sale de él. Entonces ¿qué quieres hacer? ¿Deformarla? ¿Que se salga del contenedor?

Igual más que de código, es un problema de diseño que tendrías primero que explicar para luego buscar una solución en forma de código.
  #3 (permalink)  
Antiguo 29/04/2014, 08:53
Avatar de cristo995  
Fecha de Ingreso: noviembre-2012
Mensajes: 187
Antigüedad: 12 años
Puntos: 0
Respuesta: como cambiar el alto de una imagen en bootstrap

mmm no. deformarla no , ni tampoco que salga del contenedor. es controlar el alto.

ejemplo. si mi imagen es de : 1600x900 en bootstrap la maquetacion es por medio de columnas. son 12 columnas las cuales van dentro de un contenedor..

si quiero que mi imagen ocupe todo el ancho del contenedor solo tengo que crear un div y ponerle una clase especificandole de cuantas columnas esta conformado..

ejemplo

<div class="col-lg-12">
<img src.... >
</div>

si quisiera que mi imagen ocupara la mitad del contenedor y al lado tener un texto o parrafo seria asi.

<div class="col-lg-6">
<img src.....>
</div>

<div.class="col-lg-6">
<p>lorem impsum ................... </p>
</div>

como se puede ver las columnas las puse de 6 ya que 6+6 = 12 y cada una ocupa la mitad

entonces el ancho lo puedo controlar a si ,, pero el alto si es el que no sabria como controlar
  #4 (permalink)  
Antiguo 29/04/2014, 09:30
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: como cambiar el alto de una imagen en bootstrap

No hace falta que lo controles, porque supongo que Bootstrap sólo ajustará la imagen a las columnas que te hagan falta, y su altura la calcula el motor de renderizado del navegador para ajustar la altura al ancho.
  #5 (permalink)  
Antiguo 29/04/2014, 09:45
Avatar de cristo995  
Fecha de Ingreso: noviembre-2012
Mensajes: 187
Antigüedad: 12 años
Puntos: 0
Respuesta: como cambiar el alto de una imagen en bootstrap

y si por alguna razon la imagen que estoy utilizando la quiero con un poquito menos de alto ??

bno de todas formas ya le baje un poco la altura a la imagen con photoshop :)

solo que pensaba que asi como puedo controlar el ancho mediante las columnas
deberia haber una forma tambien para el alto
  #6 (permalink)  
Antiguo 29/04/2014, 09:50
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: como cambiar el alto de una imagen en bootstrap

Cita:
Iniciado por cristo995 Ver Mensaje
solo que pensaba que asi como puedo controlar el ancho mediante las columnas
deberia haber una forma tambien para el alto
No. De hecho cualquier sistema de grillas funciona así, no es algo propio de Bootstrap. Además, no se llamaría entonces columnas sino filas o columfias... Filumnas, o algo así.

Etiquetas: alto, bootstrap, imagenes, responsive, tamaño
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 09:12.