Grupos Efeito redondo

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

Resolvido Grupos Efeito redondo

Mensagem por Thalia Grace em 07/06/14, 02:15 am

  • Descrição:
Como deixar os grupos com esses círculos redondos e a legenda do lado? 
Grata.

http://cupcakegraphics.forumeiros.com/

  • Informações:
Fórum:http://testesgraficoshtmlcs.forumeiros.com/Versão:PHPBB2
Tipo:Pedido de códigoTags:Grupos,Efeito,redondo

avatar

Thalia Grace
Nível 8

Masculino
Inscrito dia : 03/05/2014
Mensagens : 124
Pontos Ativos : 199

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

Resolvido Re: Grupos Efeito redondo

Mensagem por Lima 3005 em 07/06/14, 09:23 am

Poderia colocar um PrintScreen do que deseja?
avatar

Lima 3005
Usuário destaque

Masculino
Inscrito dia : 08/02/2013
Mensagens : 631
Pontos Ativos : 880

Ver perfil do usuário http://universogamer.foruns.com.pt

Resolvido Re: Grupos Efeito redondo

Mensagem por Thalia Grace em 07/06/14, 07:54 pm



No caso o "Users" que aparece é quando a gente passa o mouse em um dos círculos
avatar

Thalia Grace
Nível 8

Masculino
Inscrito dia : 03/05/2014
Mensagens : 124
Pontos Ativos : 199

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

Resolvido Re: Grupos Efeito redondo

Mensagem por Duel em 07/06/14, 08:32 pm

Olá!

Até tem como fazer, porém, cada grupo seria adicionado manualmente. Ficaria assim: http://prntscr.com/3qnjyk
Se almejar, termino o código. Piscada

Até.

Duel
Usuário avançado

Masculino
Inscrito dia : 21/05/2014
Mensagens : 323
Pontos Ativos : 446

Ver perfil do usuário http://ajuda.forumeiros.com/ https://www.facebook.com/Não uso. https://twitter.com/Não tenho

Resolvido Re: Grupos Efeito redondo

Mensagem por Thalia Grace em 07/06/14, 08:55 pm

Sim eu gostaria.
avatar

Thalia Grace
Nível 8

Masculino
Inscrito dia : 03/05/2014
Mensagens : 124
Pontos Ativos : 199

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

Resolvido Re: Grupos Efeito redondo

Mensagem por Sennior em 09/06/14, 04:29 am

Saudações,

Vamos lá:
Painel de Controle Seta Visualização Seta Página inicial Seta Geral
Código:

Código:
<table id="grupos">
      
      
         
         <tbody><tr>
            
            <td>
               
            </td>
            
            <td>
                <a href="http://testeszinhos.forovenezuela.net/u1" class="gb g1"><span class="tg">Staff</span></a><a href="http://testeszinhos.forovenezuela.net/g3-moderadores" class="gb g2"><span class="tg">Mods</span></a><a href="http://testeszinhos.forovenezuela.net/g4-code-makers" class="gb g3"><span class="tg">Codes</span></a><a href="http://testeszinhos.forovenezuela.net/g5-users" class="gb g4"><span class="tg">Users</span></a>
            </td>
            
         </tr>
         
      
      
   </tbody></table>

Depois vá em:
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilo CSS
Código:
.gb {
display: inline-block;
float: up;
position: relative;
left: -60px;
height: 60px;
margin-left: 1px;
margin-right: 1px;
width: 60px;
border-radius: 120px;
}

#grupos .g1 {
background: #000000;
color: #000000;
}
#grupos .g2 {
background: #031634;
color: #000000;
}
#grupos .g3 {
background: #032f34;
color: #000000;
}
#grupos .g4 {
background: #33343b;
color: #000000;
}
element.style {
}
.tg {
display: none;
font-family: La Belle Aurore;
font-size: 26px;
right: -100px;
top: 75px;
margin-left: 3px;
position: absolute;
text-align: right;
width: 200px;
}
#grupos td .gb:hover .tg {
display: inline-block;
}

Abraços.
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