XenForo Toplu kullanıcı adı stilleri

[Root]

Uyumlu XF 2 Sürümleri

Merhaba, şimdi kalıcı ve herkesin daha kolay bulabileceği kullanıcı adı stillerini sizinle paylaşıyorum.

1.Turuncu yıldız stili
Kod:
Kod:

CSS:
color:orange;
background:
url("img/star1.gif") repeat scroll 0 0%;

Resim:

Sonuç:

2.Gradient stili
Kod:
CSS:
CSS:

background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );
background-image: gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );
color:transparent;
-webkit-background-clip: text;
background-clip: text;

Sonuç:

3.Turuncu yangın
Kod:
CSS:
CSS:

text-shadow: #e4a42d 1px 1px 10px;
color: #e4a42d;
font-weight: bold;
background: url(https://siteniz.com/img/fire_orange.gif);

Resim:

Sonuç:

4.Mavi yangın
Kod:
CSS:
CSS:

text-shadow: #6495ed 1px 1px 10px;
color: #6495ed;
font-weight: bold;
background: url(https://siteniz.com/img/fire_blue.gif);
Resim:

Sonuç:

5.Yeşil yangın
Kod:
CSS:
CSS:

text-shadow: #42bd42 1px 1px 10px;
color: #34d834;
font-weight: bold;
background: url(https://siteniz.com/img/fire_green.gif);

Resim:

Sonuç:

6.Kırmızı yangın
Kod:
CSS:
CSS:

text-shadow: red 1px 1px 10px;
color: red;
font-weight: bold;
background: url(https://siteniz.com/img/fire_red.gif);

Resim:

Sonuç:

7.Mavi neon
Kod:
CSS:
CSS:

color: #fff;
text-shadow: 1px 1px 1px #0071db, 0px 0px 3px #0071db, 0px 0px 5px #0071db, 0px 0px 7px #0071db;
font-weight: bold;

Sonuç:

8.Parti stili
Kod:
CSS:
CSS:

text-shadow: #2b65ec 1px 1px 30px;
color: #7F00FF;
font-weight: bold;
background: url(https://siteniz.com/img/confetti.gif);
animation: blink 5s infinite;
-moz-animation: blink 5s infinite;
-webkit-animation: blink 5s infinite;
-ms-animation: blink 5s infinite;
-o-animation: blink 5s infinite;

Resim:

Sonuç:

9.Mor stili
Kod:
CSS:
CSS:

text-shadow: #800080 1px 1px 12px;
color: MediumPurple;
font-weight: bold;
background: url(https://siteniz.com/img/star1.gif);

Resim:

Sonuç:

10.Gradient 2
Kod:
CSS:
CSS:

background-image: linear-gradient(270deg, #d83b3b, #e3ed20, #20ed2d, #2082ed, #cd20ed, #20edbe) !important;
background-size: 1200% 1200% !important;
-webkit-animation: TestBanner 30s ease infinite !important;
-moz-animation: TestBanner 30s ease infinite !important;
animation: TestBanner 30s ease infinite !important;
color: transparent;
-webkit-background-clip: text;
background-clip: text;
font-weight: 900;

Extra.less

CSS:
@-webkit-keyframes TestBanner {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}
@-moz-keyframes TestBanner {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}
@keyframes TestBanner {
0% {
background-position: 0% 50%
}
50% {
background-position: 100% 50%
}
100% {
background-position: 0% 50%
}
}

Sonuç:

11. Hidden stili
Kod:
CSS:
CSS:

text-transform: uppercase;
overflow: hidden;
background: linear-gradient(90deg, #000000, #ffffff, #000000);
background-repeat: no-repeat;
background-size: 80%;
animation: hiddenstil 3s linear infinite;
-webkit-background-clip: text;
-webkit-text-fill-color: rgba(255, 255, 255, 0);

Extra.less

CSS:
@keyframes hiddenstil {
0% {
background-position: -500%;
}
100% {
background-position: 500%;
}
}

Sonuç:

CSS:
color:orange;
background:
url("img/star1.gif") repeat scroll 0 0%;

 

[yarmakarus]

Selamlar,resimleri güncelleyebilir misiniz ?