Staff en línea
Últimos temas
[Ocio] Contemos hasta el 5000
por Chalo Lun Ago 13, 2018 8:29 am

[CSS] Re diseña la toolbar
por lnymph Lun Ago 13, 2018 2:47 am

[ocio] Tus frases favotitas
por lnymph Lun Ago 13, 2018 2:29 am

[cine] ¿Cual es tu pelicula favorita?
por lnymph Lun Ago 13, 2018 2:20 am

[Ocio] ¿De que país sois?
por lnymph Lun Ago 13, 2018 2:17 am

Página 2 de 2. Precedente  1, 2

[Resuelto] Como se hace este efecto como de "sombreado" en el índice del foro?
Tema iniciado por y Añadir a favoritos

Recuerdo del primer mensaje :

[problema] Abajo lo digo
Versión de mi foro::phpb3
Navegador::G. Chrome
Descripcion del problema: No tengo problema, solo que me gustaría saber como se logra ese efecto, como si estuviera "desprendido" el índice del foro, no sé como explicarlo, o sea, que no se ve todo plano, todo pegado.
Capturas de pantalla del problema:

Spoiler:


.
Temas resueltos[/b][/ok]
BlueDiamante
avatar

¿Que estoy pensando? :

Las navidades se acercan y nuestro mundo no está feliz.... [table class=fecha_up][td]Se modifico:12/11/16 - 20:12 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

133


Puntos :

187


Me gusta :

36


ingreso :

17/10/2016


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

@YoshiGM escribió:[quotelink="/t1272-en-curso-como-se-hace-este-efecto-como-de-sombreado-en-el-indice-del-foro#15652"]
Te doy otra propuesta.. Encontré este generador de sombras con CSS:
http://www.cssmatic.com/es/box-shadow

Ahi ya te da los valores y puede que encuentres el efecto deseado

Primero copie este texto, que obviamente es el que usaron para que se viera ese efecto en la imágen en amarillo



Pegué exactamente ese en mi foro de pruebas y no pasó nada. Estuve cambiandole los números y nada!



Pero, ya ni te ocupes eh, Yoshi? Así lo dejo no es importante. Te lo agradezco mucho y si desean doy por resuelto el tema, igual y si le funciona perfecto a otra persona no creen? [Cesp]#128522;[/Cesp]

El asunto es que, si se fijan, en la primer imágen que dejé, no se ve precisamente tan sombreado, sino como..... "despegado".....

BlueDiamante
avatar

¿Que estoy pensando? :

Las navidades se acercan y nuestro mundo no está feliz.... [table class=fecha_up][td]Se modifico:12/11/16 - 20:12 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

133


Puntos :

187


Me gusta :

36


ingreso :

17/10/2016


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

Ahora combina los valores:

Código:
#wrap {
CSS DEL GENERADOR
}
YoshiGM
avatar

¿Que estoy pensando? :

Aquí Sigo .w. [table class=fecha_up][td]Se modifico:12/07/18 - 17:29 hrs. [/td][/table]


Banner en temas :

https://i.servimg.com/u/f19/13/45/80/80/banner10.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #555


Mensajes :

1130


Puntos :

1504


Me gusta :

214


ingreso :

17/12/2014


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario http://www.yoshifansclub.net

Volver arriba Ir abajo

@YoshiGM escribió:
Ahora combina los valores:

Código:
#wrap {
CSS DEL GENERADOR
}

- Yoshi, ya no entendí: Este es el código que me da el enlace que me dejaste:

[codebox]-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);[/codebox]

El otro que me das es este:

Código:
#wrap {
CSS DEL GENERADOR
}


Debo pegar los 2 juntos? O que hago con el último? (disculpa...)

[codebox]-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);

#wrap {
CSS DEL GENERADOR
}[/codebox]

BlueDiamante
avatar

¿Que estoy pensando? :

Las navidades se acercan y nuestro mundo no está feliz.... [table class=fecha_up][td]Se modifico:12/11/16 - 20:12 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

133


Puntos :

187


Me gusta :

36


ingreso :

17/10/2016


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

Nop, me refiero a que pongas los atributos dentro del CSS:

Código:
#wrap {
-webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}
YoshiGM
avatar

¿Que estoy pensando? :

Aquí Sigo .w. [table class=fecha_up][td]Se modifico:12/07/18 - 17:29 hrs. [/td][/table]


Banner en temas :

https://i.servimg.com/u/f19/13/45/80/80/banner10.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #555


Mensajes :

1130


Puntos :

1504


Me gusta :

214


ingreso :

17/12/2014


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario http://www.yoshifansclub.net

Volver arriba Ir abajo

Pus no Yoshi, no se puede.

Ya puse ese código tal cual y el sombreado solo queda del lado der. del izq. queda plano plano. Le pongo el guioncito antes de los pixeles y se va todo el sombreado del izq. y es el der. el que queda plano. Uuuuuy esto te va a sacar canas verdes (bueh... ni se te van a ver [Cesp]#128518;[/Cesp]). Yo creo que ya mejor no le busques Yoshi, es que me da un montón de pena hacerte trabajar, ya trabajaste mucho y esto no se deja. [Cesp]#128536;[/Cesp]

Muchas, muchas, muuuuuuuuuuchas Gracias!!!!!!

BlueDiamante
avatar

¿Que estoy pensando? :

Las navidades se acercan y nuestro mundo no está feliz.... [table class=fecha_up][td]Se modifico:12/11/16 - 20:12 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

133


Puntos :

187


Me gusta :

36


ingreso :

17/10/2016


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

Hola, disculpa, no es que el código no sirva, de hecho el que te dio Yoshi sirvió perfectamente, el error está en la orientación de la sombre, el código box-shadow (sombra de la caja o elemento) cumple con esta sintaxis

box-shadow: x, y, s, c;

X: Movimiento horizontal
Y: Movimiento Vertical
S: Grosor de la sombra
C: El color que ya conocemos.

Usa este codigo (es el mismo que ya tenias pero con los valores y colores alterados)

Código:
#wrap {
    background-color: #1a1a1f;
    border: 1px solid #735346;
    margin: 0 auto;
    min-width: 951px;
    padding: 5px;
    width: 83%;
    box-shadow: 0px 11px 30px #ea642b;
}

Quedaría así, esos valores los puedes editar (los colores)




mrsrz
avatar

¿Que estoy pensando? :

... [table class=fecha_up][td]Se modifico:25/11/16 - 19:20 hrs.[/td][/table]


Banner en temas :

http://profilerehab.com/facebook_covers/musical/cool_guitar_cover_9.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

424


Puntos :

596


Me gusta :

62


ingreso :

23/12/2014


Sexo :

Masculino

Plataforma :

PunBB


Navegador :

Chrome


Ver perfil de usuario http://musicinstant.host-es.com/

Volver arriba Ir abajo

- No, yo no pensé que no sirviera el código de Yoshi, al contrario, lo que pasa es que mi foro siempre ha sido bien extraño y hay que batallarle mucho

@mrsrz escribió:
Hola, disculpa, no es que el código no sirva, de hecho el que te dio Yoshi sirvió perfectamente, el error está en la orientación de la sombre, el código box-shadow (sombra de la caja o elemento) cumple con esta sintaxis

- Listo! ha quedado perfecto con el código que me has dado. Voy a mi siguiente pregunta, relacionada con lo mismo pero en otro tema facilito la búsqueda.
Gracias Yoshi!, Gracias Mrsrz!!

Resuelto!


.
BlueDiamante
avatar

¿Que estoy pensando? :

Las navidades se acercan y nuestro mundo no está feliz.... [table class=fecha_up][td]Se modifico:12/11/16 - 20:12 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

133


Puntos :

187


Me gusta :

36


ingreso :

17/10/2016


Sexo :

Femenino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.