Como por essa barra envolta do rank

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Como por essa barra envolta do rank

Mensagem por Felipe Paiva em 29/08/13, 07:01 pm

Qual é minha questão:
Olá Queria Saber como Por isso envolta dos Ranks http://prntscr.com/1o6xm6 E Quando Passa o Mouse Aumenta tbm Igual a Esse Forum http://br-starcityrpg.forumeiros.com/forum 


Endereço do meu fórum:
http://brasilpfacil.forumeiros.com

Versão do fórum:
PHPBB3
avatar

Felipe Paiva
Nível 6

Masculino
Inscrito dia : 27/03/2013
Mensagens : 72
Pontos Ativos : 139

Ver perfil do usuário http://brasilsecondlifebsl.forumeiros.com

Resolvido Re: Como por essa barra envolta do rank

Mensagem por MateusA em 29/08/13, 07:11 pm

Olá!

Se refere ao neon?; Ou ao contorno branco?

Até mais.
avatar

MateusA
Hiperativo

Masculino
Inscrito dia : 13/05/2013
Mensagens : 3225
Pontos Ativos : 4215

Ver perfil do usuário https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Resolvido Re: Como por essa barra envolta do rank

Mensagem por Felipe Paiva em 29/08/13, 07:13 pm

Tipo Crazy Eu Me Refiro Ao Contorno Mais se Souber o Neon Tbm Tabom Piscada
avatar

Felipe Paiva
Nível 6

Masculino
Inscrito dia : 27/03/2013
Mensagens : 72
Pontos Ativos : 139

Ver perfil do usuário http://brasilsecondlifebsl.forumeiros.com

Resolvido Re: Como por essa barra envolta do rank

Mensagem por Ip.Design em 29/08/13, 07:16 pm

Código:
        #i_whosonline + p br + br + em a:hover {
        background: #DDD;
        padding: 9px 10px 10px;
        }
        #i_whosonline + p br + br + em a {
        -webkit-transition-duration: .3s;
        font-size: 15px;
        font-style: normal;
        font-weight: 400;
        margin: 0 5px;
        text-shadow: 0 1px 1px #454545;
        }
Adicione ao seu CSS.

Ip.Design
Nível 2

Masculino
Inscrito dia : 28/08/2013
Mensagens : 7
Pontos Ativos : 13

Ver perfil do usuário http://ipdesign.maisforum.com/

Resolvido Re: Como por essa barra envolta do rank

Mensagem por MateusA em 29/08/13, 07:20 pm

Olá!

Acrescente este código na tua 'Folha de Estilos':
Código:
#main-content > p:nth-child(13) > em:nth-child(50) {
background-position: center;
background-repeat: no-repeat;
background: url(http://i34.tinypic.com/b80g87.png) no-repeat 50% 0;
padding: 24px 0;
}
Até mais!
avatar

MateusA
Hiperativo

Masculino
Inscrito dia : 13/05/2013
Mensagens : 3225
Pontos Ativos : 4215

Ver perfil do usuário https://www.facebook.com/forumeirospt https://twitter.com/forumeiros_pt

Resolvido Re: Como por essa barra envolta do rank

Mensagem por Gaaratsu em 30/08/13, 02:36 am

Saudações!

Código:
Código:
#i_whosonline + p br + br + em {
width: 70%;
background: white url(http://i44.servimg.com/u/f44/15/34/61/11/grey-u10.png) repeat-x scroll left bottom;
border: 2px solid #DDD;
border-radius: 6px;
text-align: center;
padding: 10px 8px 5px 5px;
display: block;
margin: 0 auto;
font-size: 0px;
color: transparent;
}
#i_whosonline + p br + br + em a {
-webkit-transition-duration: .3s;
text-shadow: 0px 1px 1px #454545;
font-size: 15px;
margin: 0 5px;
font-style: normal;
font-weight: normal;
}
#i_whosonline + p br + br + em {
background: url("http://i88.servimg.com/u/f88/14/28/28/25/111.png") repeat-x scroll left bottom rgb(255, 255, 255);
border: 2px solid rgb(221, 221, 221);
border-radius: 6px 6px 6px 6px;
color: transparent;
display: block;
font-size: 0px;
font-weight: 700;
margin: 0px auto;
padding: 10px 8px 5px 5px;
text-align: center;
text-shadow: 0px 0px 5px rgb(221, 0, 255);
width: 70%;
}
#i_whosonline + p br + br + em a {
border-bottom: 1px solid rgb(212, 214, 213);
font-size: 15px;
font-style: normal;
font-weight: 700;
margin: 0px 5px;
text-shadow: 0px 1px 1px rgb(78, 238, 148);
}
#i_whosonline + p br + br + em {
width: 70%;
background: white url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom;
border: 2px solid #DDD;
border-radius: 6px;
text-align:center;
padding: 10px 8px 5px 5px;
display: block;
margin: 0 auto;
font-size: 0px;
color: transparent;
}

#i_whosonline + p br + br + em a {
-webkit-transition-duration: .3s;
text-shadow: 0px 1px 1px #4EEE94;
font-size: 15px;
margin: 0 5px;
font-style: normal;
font-weight: normal;
}

#i_whosonline + p br + br + em a:hover {
background: #DDD;
padding: 9px 10px 10px;
}
Adicione na tua CSS: Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de estilo CSS

Nota: Eu peguei todo o código completo da própria folha de estilo CSS do fórum indicado, no entanto, antes mesmo de utilizar o código que lhe indiquei, exclua todos os códigos fornecidos neste mesmo tópico para que o código recomendado acima funcione perfeitamente. Muito feliz

Atenciosamente,
knorr. Piscada
avatar

Gaaratsu
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 07/08/2010
Mensagens : 5927
Pontos Ativos : 7402

Ver perfil do usuário http://narutongo.forumeiros.com/

Resolvido Re: Como por essa barra envolta do rank

Mensagem por First em 30/08/13, 12:38 pm

Olá,

Peço ao senhor que adicione este código em sua Folha de estilO CSS:
Código:
#i_whosonline + p br + br + em a:hover {
background: #DDD;
padding: 9px 10px 10px;
}
#i_whosonline + p br + br + em a {
border-bottom: 1px solid rgb(212, 214, 213);
font-size: 15px;
font-style: normal;
font-weight: 700;
margin: 0px 5px;
text-shadow: 0px 1px 1px rgb(78, 238, 148);
}
#i_whosonline + p br + br + em {
background: url("http://i88.servimg.com/u/f88/14/28/28/25/111.png") repeat-x scroll left bottom rgb(255, 255, 255);
border: 2px solid rgb(221, 221, 221);
border-radius: 6px 6px 6px 6px;
color: transparent;
display: block;
font-size: 0px;
font-weight: 700;
margin: 0px auto;
padding: 10px 8px 5px 5px;
text-align: center;
text-shadow: 0px 0px 5px rgb(221, 0, 255);
width: 70%;
}

Até mais.
avatar

First
Membro do Fórum

Masculino
Inscrito dia : 12/07/2013
Mensagens : 1287
Pontos Ativos : 1843

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com//victor.jagata

Resolvido Re: Como por essa barra envolta do rank

Mensagem por Sennior em 31/08/13, 12:02 am

Boas! Muito feliz

Vá até teu CSS:
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilo CSS

Código:
#i_whosonline + p br + br + em {
background: url("http://i88.servimg.com/u/f88/14/28/28/25/111.png") repeat-x scroll left bottom rgb(255, 255, 255);
border: 2px solid rgb(221, 221, 221);
border-radius: 6px 6px 6px 6px;
color: transparent;
display: block;
font-size: 0px;
font-weight: 700;
margin: 0px auto;
padding: 10px 8px 5px 5px;
text-align: center;
text-shadow: 0px 0px 5px rgb(221, 0, 255);
width: 70%;
}
#i_whosonline + p br + br + em {
width: 70%;
background: white url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom;
border: 2px solid #DDD;
border-radius: 6px;
text-align: center;
padding: 10px 8px 5px 5px;
display: block;
margin: 0 auto;
font-size: 0px;
color: transparent;
}
#i_whosonline + p br + br + em {
width: 70%;
background: white url(http://i44.servimg.com/u/f44/15/34/61/11/grey-u10.png) repeat-x scroll left bottom;
border: 2px solid #DDD;
border-radius: 6px;
text-align: center;
padding: 10px 8px 5px 5px;
display: block;
margin: 0 auto;
font-size: 0px;
color: transparent;
}
#i_whosonline + p br + br + em a {
border-bottom: 1px solid rgb(212, 214, 213);
font-size: 15px;
font-style: normal;
font-weight: 700;
margin: 0px 5px;
text-shadow: 0px 1px 1px rgb(78, 238, 148);
}
#i_whosonline + p br + br + em a {
-webkit-transition-duration: .3s;
text-shadow: 0px 1px 1px #4EEE94;
font-size: 15px;
margin: 0 5px;
font-style: normal;
font-weight: normal;
}
#i_whosonline + p br + br + em a {
-webkit-transition-duration: .3s;
text-shadow: 0px 1px 1px #454545;
font-size: 15px;
margin: 0 5px;
font-style: normal;
font-weight: normal;
}
#i_whosonline + p br + br + em a:hover {
background: #DDD;
padding: 9px 10px 10px;
}
<li> Coloque no inicio.

Até mais.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum