lograr este borde

pod1221 · #1 (**permalink**) 16/12/2009, 10:09

como logro un borde sombreado como este aka les dejo una imagen:

http://i48.tinypic.com/2inp0h.png

es posible o esta echo con pothoshop¡¡??

Impostor · #2 (**permalink**) 16/12/2009, 10:33

Sin ver el código fuente pueden ser mil cosas.... Un borde añadido que da apariencia de sombra, la imagen de fondo que le han incluido ese sombreado con photoshop.. Se puede hacer..

Yo personalmente, lo haria con photoshop, creo que es mas sencillo.

Saludos¡¡

pod1221 · #3 (**permalink**) 16/12/2009, 14:38

agradeceria si alguien me podria explicar como lograr ese borde en css y como en potoshop.

grax!

Impostor · #4 (**permalink**) 16/12/2009, 15:18

Con css añadiendole la propiedad border al div http://www.librosweb.es/referencia/css/border.html

Con photoshop, mejor pregunta en el foro de diseño gráfico.

seoista · #5 (**permalink**) 17/12/2009, 00:58

Estas repitiendo mensaje (http://www.forosdelweb.com/f53/borde...-estos-761844/)

Saludos.

vmorales · #6 (**permalink**) 17/12/2009, 04:42

Cita:

Iniciado por Impostor

Sin ver el código fuente pueden ser mil cosas.... Un borde añadido que da apariencia de sombra, la imagen de fondo que le han incluido ese sombreado con photoshop.. Se puede hacer..

Yo personalmente, lo haria con photoshop, creo que es mas sencillo.

Saludos¡¡

...es posible o esta echo con pothoshop¡¡??

¿Como vas a escribir una pagina si no sabes escribir tu lengua?
Hecho... se escribe con "h".

chotuno · #7 (**permalink**) 17/12/2009, 06:06

Cita:

Iniciado por vmorales

...es posible o esta echo con pothoshop¡¡??

¿Como vas a escribir una pagina si no sabes escribir tu lengua?
Hecho... se escribe con "h".

No entiendo que tiene que ver una cosa con la otra..

willyfc · #8 (**permalink**) 17/12/2009, 07:16

veamos, ese tipo de borde(sombreado), con CSS2.1 no se puede lograr, es necesario utilizar una imagen que la haces en cualquier editor gráfico.
Suponiendo que tengo una imagen para el fondo como la siguiente:

que mide 800px de ancho incluyendo la sombra.

El truco consiste en recortar una parte de la imagen para que se repita en el eje-y, en el caso de la img de ejemplo bastará con recortar un pedacito de la img que mida 800px por 2px y ponerla de fondo del contenedor principal.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
body{color:#FFF;}
#contenedor_principal{width:800px; margin:0 auto; background:url(imagenes/fondo.png) repeat-y;}
p{padding:15px;}
</style>
</head>
 
<body>
<div id="contenedor_principal">
    <p>Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido </p>
    <p>
    Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido 
    </p>
</div>
</body>
</html>

teniendo como resultado esto:

pod1221 · #9 (**permalink**) 17/12/2009, 07:47

Cita:

Iniciado por willyfc

veamos, ese tipo de borde(sombreado), con CSS2.1 no se puede lograr, es necesario utilizar una imagen que la haces en cualquier editor gráfico.
Suponiendo que tengo una imagen para el fondo como la siguiente:

que mide 800px de ancho incluyendo la sombra.

El truco consiste en recortar una parte de la imagen para que se repita en el eje-y, en el caso de la img de ejemplo bastará con recortar un pedacito de la img que mida 800px por 2px y ponerla de fondo del contenedor principal.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
body{color:#FFF;}
#contenedor_principal{width:800px; margin:0 auto; background:url(imagenes/fondo.png) repeat-y;}
p{padding:15px;}
</style>
</head>
 
<body>
<div id="contenedor_principal">
    <p>Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido </p>
    <p>
    Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido Aqui va todo el contenido 
    </p>
</div>
</body>
</html>

teniendo como resultado esto:

gracias por todo me re sirvio te lo agradesco.

pod1221 · #10 (**permalink**) 17/12/2009, 07:49

Cita:

Iniciado por vmorales

...es posible o esta echo con pothoshop¡¡??

¿Como vas a escribir una pagina si no sabes escribir tu lengua?
Hecho... se escribe con "h".

flaco me parece que este foro es para ayudar no veo por que criticas ademas que haces en este foro si sos tan perfecto??

jaja lo suponia es un..

jomaruro · #11 (**permalink**) 17/12/2009, 13:28

Hola:

Cita:

Iniciado por pod1221

flaco me parece que este foro es para ayudar no veo por que criticas ademas que haces en este foro si sos tan perfecto??

Perdón por meterme donde no me llaman, pero creo que no estaría de más que cuidaramos un poco nuestra cultura ¿no crees? ¿o prefieres volverte cavernícola? Además, está dentro de las normas de uso del foro. Si cada uno escribe como le da la gana terminaremos por no entendernos. Si un simple lenguaje de programación da error o no funciona correctamente si cometes una "falta de ortografía" ¿Por qué no leyendo/escribiendo?

Cita:

Iniciado por pod1221

jaja lo suponia es un..

Prefiero no interpretar eso como una falta de respeto a otro usuario del foro.

Saludos.

PD.: Yo tampoco soy perfecto.