Como adicionar um efeito ao nome do gradiente com animação

Detalhes da questão

Descrição

Skull_MasteR escreveu:Então meu jovem, não tem mistério. Acabei de testar no meu Fórum, e sim, dá certo.

Só que o código CSS no qual nosso amigo Chagas citou, só aplica o efeito nos Usuários, portanto fiz uma modificação para que funcione nos grupos também.

Efeito nos Usuários:

Código:

a[href^="/u"] span[style*="#FF0004"] {
    background: repeating-linear-gradient(to right, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
    -webkit-background-clip: text;
    background-size: 1800% 1800%;
    -webkit-text-fill-color: transparent;
    animation: rainbow 3s ease infinite;
}
 
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}
}


Em:

a[href^="/u"] span[style*="#FF0004"]

Apenas troque o "#FF0004" para a cor do seu grupo.

OBS: Isso serve para o código que irei falar abaixo:


Efeito nos Grupos:

Código:

a[href^="/g1-"],
a[href^="/u"] span[style*="#FF0004"] {
    background: repeating-linear-gradient(to right, #FF0000, #FF7F00, #FFFF00, #00FF00, #0000ff, #4b0082, #8f00ff);
    -webkit-background-clip: text;
    background-size: 1800% 1800%;
    -webkit-text-fill-color: transparent;
    animation: rainbow 3s ease infinite;
}
 
@keyframes rainbow {0% {background-position: 0% 82%;} 50% {background-position: 100% 19%;} 100% {background-position: 0% 82%;}
}


Em:

a[href^="/g1-"],

Troque o "g1" para o ID do seu Grupo, no qual deseja aplicar o efeito.

Prints de quê funciona: Print 1, Print 2, Print 3 e Print 4.

Caso queira, veja-o como ficou o meu fórum com este efeito.

Atenciosamente,
Skull_MasteR

Código:

font-weight: 700;

LucianoMicle escreveu:Oi! Eu trabalho corretamente, mas quero colocar o elemento e não funciona ..

Código:

font-weight: 700;

Código:

a[href^="/u"] strong {
 font-weight: 700;
}

LucianoMicle escreveu:mas quero colocar o elemento