fundo nos icones menu

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

fundo nos icones menu

Mensagem por Jhool em 07/06/18, 07:38 pm

Detalhes da questão


Endereço do fórum: http://familiawarning.forumeiros.com
Versão do fórum: PunBB

Descrição


Gostaria de saber como eu adiciono fundo nos icones do meu menu de navegação

O do meu fórum está assim: http://prntscr.com/jsacix

Gostaria de saber como deixar assim: http://prntscr.com/jsacns http://prntscr.com/jsacvs
OBS: É esse circulo no fundo do icone, que é de uma cor mais clara que a do menu para dar um destaque.

Fóruns em que vi: http://bpsbrasilplayshox.forumeiros.com/ http://ultimatelife.forumeiros.com/forum
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Pedxz em 08/06/18, 01:29 pm

Olá @Jhool,
tente adicionar isto no seu CSS:
Código:
#pun-navlinks li a.mainmenu::before {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.1);
}

Atenciosamente,
avatar

Pedxz
Usuário destaque

Masculino
Inscrito dia : 13/01/2017
Mensagens : 739
Pontos Ativos : 1055

Ver perfil do usuário https://ajuda.forumeiros.com

Re: fundo nos icones menu

Mensagem por Jhool em 08/06/18, 02:13 pm

Não teve nenhum resultado.
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Pedxz em 08/06/18, 02:42 pm

Tente então:
Código:
#pun-navlinks li a.mainmenu::before {
  background: rgba(0,0,0,0.1);
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 1px;
}
avatar

Pedxz
Usuário destaque

Masculino
Inscrito dia : 13/01/2017
Mensagens : 739
Pontos Ativos : 1055

Ver perfil do usuário https://ajuda.forumeiros.com

Re: fundo nos icones menu

Mensagem por Jhool em 08/06/18, 02:47 pm

Nada, será que pode ser algum conflito?
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Pedxz em 08/06/18, 02:50 pm

Eu testei e ambos os códigos estão a funcionar, tente adicionar:
Código:
background: rgba(0,0,0,0.1);
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 1px;
após cada ícone (CSS)
avatar

Pedxz
Usuário destaque

Masculino
Inscrito dia : 13/01/2017
Mensagens : 739
Pontos Ativos : 1055

Ver perfil do usuário https://ajuda.forumeiros.com

Re: fundo nos icones menu

Mensagem por Jhool em 08/06/18, 03:21 pm

sabe me dizer a onde se localiza tais icones?
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por RafaelS. em 09/06/18, 03:35 pm

Olá @Jhool,

Tente este código:

Código:
   
#pun-navlinks li a.mainmenu::before {
background: rgba(255,255,255,0.1);
    border-radius: 100%;
    box-shadow: inset 2px 2px 3px rgba(0,0,0,0.25);
    color: #fff;
    font-size: 16px!important;
    height: 30px;
    line-height: 30px!important;
    margin: 5px 5px auto;
    text-align: center;
    transition: all .2s;
    width: 30px;
}

Até.
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3204
Pontos Ativos : 4162

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

Re: fundo nos icones menu

Mensagem por Jhool em 09/06/18, 04:04 pm

resultou mais ficou algo muito pequeno e fraco, tem que forçar a vista para enxergar
http://prntscr.com/jt1g0u
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por RafaelS. em 09/06/18, 04:49 pm

Tente este, amigo:

Código:
#pun-navlinks li a.mainmenu::before {
    background: rgba(255, 255, 255, 0.27);
    border-radius: 100%;
    box-shadow: inset 2px 2px 3px rgba(0,0,0,0.25);
    color: #fff;
    padding: 4px;
    padding-right: 5px !important;
    padding-left: 5px !important;
    margin-right: 5px;
}

Até.
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3204
Pontos Ativos : 4162

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

Re: fundo nos icones menu

Mensagem por Jhool em 09/06/18, 05:08 pm

Creio que os icones ficaram embaçados, eu não lembro quando e como instalei eles, sabe como consigo altera-los? http://prntscr.com/jt27g4
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por RafaelS. em 09/06/18, 05:25 pm

Troque novamente por este:

Código:
#pun-navlinks li a.mainmenu::before {
    background: rgba(255, 255, 255, 0.27);
    border-radius: 100%;
    box-shadow: inset 2px 2px 3px rgba(0,0,0,0.25);
    color: #fff;
    padding: 4px;
    padding-right: 5px !important;
    padding-left: 5px !important;
    margin-right: 5px;
    font-weight: 100;
}
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3204
Pontos Ativos : 4162

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

Re: fundo nos icones menu

Mensagem por Jhool em 09/06/18, 05:41 pm

A onde eu modifico para alterar a cor da bolinha?
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por RafaelS. em 09/06/18, 05:42 pm

No código que eu passei, você vai encontrar:

background: rgba(255, 255, 255, 0.27);

Substitua a parte em negrito pela cor desejada.

Até.
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3204
Pontos Ativos : 4162

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

Re: fundo nos icones menu

Mensagem por Jhool em 09/06/18, 05:43 pm

Eu queria deixar mais ou menos assim: http://prntscr.com/jt2m6w
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 10/06/18, 03:31 pm

upppppppp
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 11/06/18, 04:00 am

upppppppppppppppppppp
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 12/06/18, 12:14 am

@Jhool escreveu:Eu queria deixar mais ou menos assim: http://prntscr.com/jt2m6w

up, alguém poderia ajudar?
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 13/06/18, 11:06 am

uppppppp
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 15/06/18, 01:47 am

upppppppp
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

Re: fundo nos icones menu

Mensagem por Jhool em 17/06/18, 06:16 pm

upppppppp
avatar

Jhool
Usuário avançado

Masculino
Inscrito dia : 10/01/2017
Mensagens : 331
Pontos Ativos : 525

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

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


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