PDA

Ver la versión completa : Como usar CSS en tu chat



xLaming
02/09/2016, 14:10
Hola, hoy les ensiñaré como usar css en tu chat grupo.

CSS:

background:url(http://i65.tinypic.com/14npm61.png) center repeat-x}#glu{position:absolute}img[height='32']{border-radius:20px}*{text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black}table{background:transparent} img[height='32']{background:#000000}*{font-size:10px}#glu{height:750px}#glu{top:0}#glu{z-index:1}[colspan='27']{display:none}.vbmenu_control{display:none}td[width="2%"] img{opacity:0}td[width="2%"][rowspan]{position:static}td[width="2%"][rowspan]{margin-top:50px}td[width="2%"][rowspan]{background:url(http://i67.tinypic.com/9uqezc.png) top -50px left 0px no-repeat}td[width="2%"] img{width:58px}td[width="2%"] img{height:60px}td[width="2%"] img{position:static}td[width="2%"] img{margin-top:0px}img,a,embed{position:relative}img,a,embed{ z-index:2;}

HTML:

<style>
div[name='social'] {
position:fixed;
margin-left: 90%;
margin-top: 10%;
left: 6%;
right: 50px;
}
div[name='social'] img:hover{
filter: blur(2px);
transition: all ease-in-out 0.4s;
}
</style>
<div style="display:none">
<a href="http://xat.com/" target="_blank" ><img src="http://i.imgur.com/L7UD2kb.png"/>
</div>
<div name="social">
<a href="http://fb.com/xLaming"><img width="50" src="http://i68.tinypic.com/25p0e2o.png" /></a>
<a href="http://twitter.com/xLaming"><img width="50" src="http://i68.tinypic.com/jpewsi.png" /></a>
</div>

Tutorial:
- Primero debes entrar en el Edit de tu chat:
http://i63.tinypic.com/350mmwg.png

- Ahora vamos agregar los codigos css y html, en Background debes agregar el codigo css, y en la caja grande debes agregar el codigo html:
http://i66.tinypic.com/ou339v.png

Ahora solo guardar los cambios y listo!

Demo:
http://i68.tinypic.com/2a8m4rc.png

Cami
03/09/2016, 13:25
Me gusta mucho el template, por un momento pensé que era una versión Mario Bross.

Saludos Cordiales.