Foros del Web » Creando para Internet » CSS »

cómo poner Fotos grandes

Estas en el tema de cómo poner Fotos grandes en el foro de CSS en Foros del Web. Cómo puedo poner fotos como por ejemplo la de esta web? http://pcnw.org/ Yo soy muy nuevo con el css pero por ejemplo esta portada de ...
  #1 (permalink)  
Antiguo 07/11/2010, 00:40
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
cómo poner Fotos grandes

Cómo puedo poner fotos como por ejemplo la de esta web? http://pcnw.org/
Yo soy muy nuevo con el css pero por ejemplo esta portada de la web no la veo tan complicada exepto por el navegador y esa foto inmensa como puedo poner fotos asi?
como imagen de fondo?
  #2 (permalink)  
Antiguo 07/11/2010, 04:05
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: cómo poner Fotos grandes

Hola:

En este caso está colocada con la etiqueta img:

Código HTML:
Ver original
  1. <img="http://pcnw.org/files/header-open_field.jpg" />

Pero también se puede colocar como background mediante CSS

Código CSS:
Ver original
  1. background: url(http://pcnw.org/files/header-open_field.jpg) no repeat;

Saludos.

  #3 (permalink)  
Antiguo 07/11/2010, 07:38
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:

En este caso está colocada con la etiqueta img:

Código HTML:
Ver original
  1. <img="http://pcnw.org/files/header-open_field.jpg" />

Pero también se puede colocar como background mediante CSS

Código CSS:
Ver original
  1. background: url(http://pcnw.org/files/header-open_field.jpg) no repeat;

Saludos.

Si ponerla como imagen de fondo pero el problema es que la imagen es muy grande y no me carga en la web me carga en local. Por eso como se hace para poner fotos tan grandes como la web que mencioné anteriormente?
  #4 (permalink)  
Antiguo 07/11/2010, 09:41
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:

En este caso está colocada con la etiqueta img:

Código HTML:
Ver original
  1. <img="http://pcnw.org/files/header-open_field.jpg" />

Pero también se puede colocar como background mediante CSS

Código CSS:
Ver original
  1. background: url(http://pcnw.org/files/header-open_field.jpg) no repeat;

Saludos.


Hola y estaba revisando la web que mostre de ejemplo a lo que quisiera lograr y que los div que tiene no tienen que ver con las fotos las fotos aparaecen como de fondo ; aqui esta la web que de por cierto es muy común http://pcnw.org/ por que yo pense hacer una serie de divs y cortar la foto que quiero de tal forma que las pueda poner como imagenes de fondo y finalmente armar mi web como si fuera un rompecabezas aunq veo una tarea bastante engorrosa y llenaria de divs en cambio no veo eso en la web que muestro por redundar.........ahhh
Quén me pueda ayudar o guiar le agradeceré
  #5 (permalink)  
Antiguo 07/11/2010, 12:43
Avatar de Paramericano  
Fecha de Ingreso: agosto-2010
Mensajes: 137
Antigüedad: 7 años, 4 meses
Puntos: 8
Respuesta: cómo poner Fotos grandes

Para que te bajen fotos grandes del servidor lo más rápido posibles, baja la resolución todo lo que puedas.
Cuanto más comprimido un jpg, más rápido aparecerá (claro, menos bytes por descargar). Con un programa de diseño puedes confirgurar el grado de compresión de un archivo.
Lo que pasa que la calidad de imagen también bajará. Evalúa cuánta calidad de imagen estás dispuesto a quitar a base de ganar en velocidad de descarga.
  #6 (permalink)  
Antiguo 07/11/2010, 13:38
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por Paramericano Ver Mensaje
Para que te bajen fotos grandes del servidor lo más rápido posibles, baja la resolución todo lo que puedas.
Cuanto más comprimido un jpg, más rápido aparecerá (claro, menos bytes por descargar). Con un programa de diseño puedes confirgurar el grado de compresión de un archivo.
Lo que pasa que la calidad de imagen también bajará. Evalúa cuánta calidad de imagen estás dispuesto a quitar a base de ganar en velocidad de descarga.
Hola muchas gracias por responder ;

puedes ver esta pagina? http://pcnw.org/ ; mira esta pagina la encontre en css mania ; esa imagen no se de que forma la han puesto que a parte de tener el tamaño que tiene no figura que esté dentro de los divs que tiene al rededor, quisiera me pudieras decir como haria para hacer algo parecido parece como una imagen de fondo, incluso no te la opcion de copiar la imagen.
  #7 (permalink)  
Antiguo 07/11/2010, 14:00
Avatar de PedroDesing  
Fecha de Ingreso: octubre-2007
Ubicación: Barcelona, España
Mensajes: 202
Antigüedad: 10 años, 1 mes
Puntos: 18
Respuesta: cómo poner Fotos grandes

Si no está en el código fuente de la web, imagino que estará en el css mediante la opción background. No te obsesiones con el hecho de que la imagen sea muy grande, porque como bien te han dicho ya, haciendo Guardar para web(ctrl+shift+alt+s) en Photoshop puedes reducir el peso de la imagen considerablemente sin perjudicar demasiado su calidad. Recuerda poner tus imagenes a 72 ppp, ya que para visualización por pantalla es suficiente.

Un saludo.
  #8 (permalink)  
Antiguo 07/11/2010, 16:05
Avatar de Paramericano  
Fecha de Ingreso: agosto-2010
Mensajes: 137
Antigüedad: 7 años, 4 meses
Puntos: 8
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por rafret Ver Mensaje
Hola muchas gracias por responder ;

puedes ver esta pagina? http://pcnw.org/ ; mira esta pagina la encontre en css mania ; esa imagen no se de que forma la han puesto que a parte de tener el tamaño que tiene no figura que esté dentro de los divs que tiene al rededor, quisiera me pudieras decir como haria para hacer algo parecido parece como una imagen de fondo, incluso no te la opcion de copiar la imagen.
Primero de todo, he visto que es una imagen jpeg de 1024x350px, i sólo ocupa 50kb!
Es un div con la imagen puesta (nada de background).
Pero el CSS del div donde está es:
Z-INDEX: 2;
OVERFLOW: hidden;
WIDTH: 1024px; CLIP: rect(0px 1024px 350px 0px);
POSITION: absolute;
HEIGHT: 350px
...indica el tamaño y que es una capa que está detrás de todas las demás.
  #9 (permalink)  
Antiguo 07/11/2010, 17:00
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: cómo poner Fotos grandes

muchas gracias ya lo pude hacer y subi una prueba una foto de 1 mega



la pagina solo es para probar no se fijen en el diseño porfavor


www.grapsaco.com/jofret/prueba1.html


im so so happy
  #10 (permalink)  
Antiguo 07/11/2010, 17:57
 
Fecha de Ingreso: junio-2010
Mensajes: 183
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por Paramericano Ver Mensaje
Primero de todo, he visto que es una imagen jpeg de 1024x350px, i sólo ocupa 50kb!
Es un div con la imagen puesta (nada de background).
Pero el CSS del div donde está es:
Z-INDEX: 2;
OVERFLOW: hidden;
WIDTH: 1024px; CLIP: rect(0px 1024px 350px 0px);
POSITION: absolute;
HEIGHT: 350px
...indica el tamaño y que es una capa que está detrás de todas las demás.
ok no sabia que se podía trabajar con capas tambien.

algun tutorial al respecto?
  #11 (permalink)  
Antiguo 08/11/2010, 15:37
Avatar de Paramericano  
Fecha de Ingreso: agosto-2010
Mensajes: 137
Antigüedad: 7 años, 4 meses
Puntos: 8
Respuesta: cómo poner Fotos grandes

Cita:
Iniciado por rafret Ver Mensaje
ok no sabia que se podía trabajar con capas tambien.

algun tutorial al respecto?
Bueno, tutorial, tutorial, no sé: busca por google palabras como position:relative, position:absolute, z-index...

Etiquetas: fotos, grandes, poner
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 13:07.