Foros del Web » Creando para Internet » CSS »

Un cuadrado rodeando la imagen

Estas en el tema de Un cuadrado rodeando la imagen en el foro de CSS en Foros del Web. hola estuve mirando y me dio intriga saber como se hace para crear un efecto de cuadro alrededor de una imagen, quiero lograr algo comoe ...
  #1 (permalink)  
Antiguo 06/06/2008, 10:15
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Un cuadrado rodeando la imagen

hola estuve mirando y me dio intriga saber como se hace para crear un efecto de cuadro alrededor de una imagen, quiero lograr algo comoe esto. por ej., lo unico que logre es hacer una tabla que lo rode y cree algo siminalar, lejos de ser parecido. haca les dejo lo que pude crear.

Última edición por mauricioadrian; 05/08/2008 a las 16:12 Razón: borre un link de la pagina de un cliente.
  #2 (permalink)  
Antiguo 06/06/2008, 10:29
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Respuesta: Un cuadrado rodeando la imagen

Hola mauricioadrian

Prueba con este código:

Código:
<style type="text/css">
img {border:1px solid black; padding:5px}
</style>
Saludos,
  #3 (permalink)  
Antiguo 06/06/2008, 10:43
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

javier ese estilo como lo aplico.? o se me aplica solo a todas las imagenes? gracias por tu repuesta
  #4 (permalink)  
Antiguo 06/06/2008, 10:53
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

gracias. ese era elefecto que queria lograr, lo unico malo es que se me aplica a todas las imagenes de la pagina, a todas. como puedo hacer para aplicarlo solo a algunas imagenes sin tener que ir una por una aplicandole el estilo. Se me aplica tmb en el menu de mi sitio y queda muy feo ahi. Gracias
  #5 (permalink)  
Antiguo 06/06/2008, 11:02
 
Fecha de Ingreso: enero-2008
Ubicación: Lima - Perú
Mensajes: 1.126
Antigüedad: 9 años, 10 meses
Puntos: 10
Respuesta: Un cuadrado rodeando la imagen

<style type="text/css">
.nombre {border:1px solid black; padding:5px}
</style>

agrega el nombre en la imagen que quieres q tenga el efecto
<img src="" class="nombre">
  #6 (permalink)  
Antiguo 06/06/2008, 11:22
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

Perfecto , muchas gracias che!. Hos Felicito y agradezco su ayuda.
  #7 (permalink)  
Antiguo 06/06/2008, 22:10
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

Solo habia probado el efecto con firefox y me andaba perfecto pero comprobe que con IE no me funciona. por que puede ser?
  #8 (permalink)  
Antiguo 07/06/2008, 03:53
 
Fecha de Ingreso: junio-2008
Mensajes: 30
Antigüedad: 9 años, 6 meses
Puntos: 1
Respuesta: Un cuadrado rodeando la imagen

aqui tienes varios ejemplos de lo que buscas en los dos posts.

http://www.webdesignerwall.com/tutorials/css-decorative-gallery/
  #9 (permalink)  
Antiguo 07/06/2008, 04:35
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Respuesta: Un cuadrado rodeando la imagen

Hola de nuevo.

El código debería funcionar también en IE ¿En qué versión lo estás probando?

Saludos,
  #10 (permalink)  
Antiguo 07/06/2008, 11:03
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

version 7 te paso el link de mi web y lo miras queres?

Última edición por mauricioadrian; 05/08/2008 a las 16:13
  #11 (permalink)  
Antiguo 07/06/2008, 11:19
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

filzix sos un aminal, gracias por los efectos que me pasaste voy a ver si los saco. ojala me salgan gracias a los dos!
  #12 (permalink)  
Antiguo 07/06/2008, 11:29
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

de nuevo con troplemas.jja los efectos que me pasaste filzix andan de pelicula.je. el unico problema es que yo en mis imagenes siempre conozco el ancho.pero no el alto y al aplicar este efecto no me sirve. creo. se puede hacer con estilo que una imagen de fondo se estire segun el alto de la foto?
  #13 (permalink)  
Antiguo 07/06/2008, 21:22
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

Podrian decirme si es mi explorador el que anda mal o esta mal algo puse un ejemplo con solo eso en esta direccion mirenlo por favor. es solo un segundo se encuentra la foto sola.

Última edición por mauricioadrian; 05/08/2008 a las 16:13 Razón: el link no existe mas
  #14 (permalink)  
Antiguo 08/06/2008, 04:09
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Respuesta: Un cuadrado rodeando la imagen

Hola mauricioadrian

Mira el código de estilo de tu página y compáralo con el que te pusimos en los primeros mensajes, verás que es bastante distinto.

Saludos,
  #15 (permalink)  
Antiguo 09/06/2008, 00:19
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

No javier, disculpa lo que pasa es que al codigo de prueba lo cambie , porque no sabia que probar, pero yo probe como ustedes me dijeron. ahora voy a corregir el prueba.php y lo voy a dejar cuando lo mires va a estas como me dijeron. Disculpa que lo cambie, estaba haciendo pruebas.
  #16 (permalink)  
Antiguo 10/06/2008, 11:31
Avatar de mauricioadrian  
Fecha de Ingreso: junio-2008
Mensajes: 157
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Un cuadrado rodeando la imagen

Increible. Pero es mi programación, culpaba a el tipo de imagen culpaba al explorador, culpaba el padding, nose bien porque pero cuadno agregue la etiqueta
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
salio andando, como queria, me trajo un par de inconvenientes pero ya se solucionaron.
era por la etiqueta!
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 17:24.