Olá amigos, hoje trago um tutorial com várias formas de estilizar o nick dos membros..
Então vamos la!
Podemos fazer por JQuery ou por CSS, eu vou mostrar como fazer em ambas as opções:
CSS
Adicionando uma estrela ou qualquer pequena imagem ao nick do usuário
E a URL por alguma imagem que você queira.
O resultado será semelhante a este
Algumas imagens para você usar
Ps: O processo de edição de todos é o mesmo, basta mudar o ID do usuário e a URL da imagem..
Imagem de fundo no nick do usuário
Deixando o nome do usuário em negrito
Então vamos la!
Podemos fazer por JQuery ou por CSS, eu vou mostrar como fazer em ambas as opções:
CSS
Adicionando uma estrela ou qualquer pequena imagem ao nick do usuário
- Código:
a[href="/u1"] {
background: rgba(0, 0, 0, 0) url('https://cdn1.iconfinder.com/data/icons/fatcow/16/award_star_bronze_3.png') no-repeat;
padding: 0 0 3px 17px;
}
Troque o /u1 pelo ID do usuário.a[href="/u1"] {
background: rgba(0, 0, 0, 0) url('https://cdn1.iconfinder.com/data/icons/fatcow/16/award_star_bronze_3.png') no-repeat;
padding: 0 0 3px 17px;
}
E a URL por alguma imagem que você queira.
O resultado será semelhante a este
Algumas imagens para você usar
Ps: O processo de edição de todos é o mesmo, basta mudar o ID do usuário e a URL da imagem..
Imagem de fundo no nick do usuário
- Código:
a[href="/u1"] {
background: rgba(0, 0, 0, 0) url('http://img338.imageshack.us/img338/5646/52502626.gif');
}
Deixando o nome do usuário em negrito
- Código:
a[href="/u1"] {
font-weight:bold;
}
- Código:
a[href="/u1"] {
text-decoration: line-through;
}
- Código:
a[href="/u1"] {
color: #f00;
}
- Código:
a[href="/u1"] {
text-shadow: #00569C 0 0 5px;
}