Решено Градиентный ник,не работает

Добро пожаловать!

Зарегистрировавшись у нас, вы сможете обсуждать, делиться и отправлять личные сообщения другим участникам нашего сообщества.

Зарегистрироваться!
  • Если Вы желаете помогать развитию проекта, готовы заполнять раздел(-ы) и подсказывать другим пользователям на портале, есть возможность попасть в команду редакторов. Для этого следует обратиться в техническую поддержку
Статус
В этой теме нельзя размещать новые ответы.
Пользователь
Регистрация
7 Июн 2025
Сообщения
23
Столкнулся с такой проблемой,когда пытаюсь сделать градиентный ник,он не переливается

css:
color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}
 
Решение
Дальше — Больше
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,191
в css-стиль (группы пользователя), мы добавляем только этот код;
в css стиль:
color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

а уже этот код;
в extra.less:
@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}
мы вставляем в extra.less
 
Пользователь
Регистрация
7 Июн 2025
Сообщения
23
в css-стиль (группы пользователя), мы добавляем только этот код;
в css стиль:
color: yellow;
    font-weight: bold;
    text-shadow: #f00 1px 1px 10px;
    border-raduis: 8px;
    background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 900% 20%;
    color: #1000f2;
    animation: AnimNic 10s ease infinite;

а уже этот код;
в extra.less:
@keyframes AnimBanner {    0% {
        background-position: 0% 50%    }
    50% {
        background-position: 100% 50%    }
    100% {
        background-position: 0% 50%    }
}
мы вставляем в extra.less
я так и сделал,просто скинул все в одно
 
Дальше — Больше
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,191
в css стиль:
font-weight: bold;
   background: linear-gradient(270deg, #ff0, #ff0, #f00, #ff0, #ff0);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   background-size: 400% 100%;
   animation: AnimNic 10s ease infinite;
в css стиль

в extra.less:
@keyframes AnimNic {
   0% {
       background-position: 0% 50%;
   }
   50% {
       background-position: 100% 50%;
   }
   100% {
       background-position: 0% 50%;
   }
}
в extra.less
 
Дальше — Больше
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,191
Пользователь
Регистрация
7 Июн 2025
Сообщения
23
Проверил на своем тестовом форуме, все работает. Попробуйте изменить параметр в css-стиле с;
animation: AnimNic 10s ease infinite;
на;
animation: AnimNic 3s ease infinite;
тут изменено время анимации. Должно стать быстрее.
сделал,анимация не показывалась так и не показывается,точнее ее совсем нет
 
Дальше — Больше
Команда форума
Администратор
Регистрация
21 Янв 2023
Сообщения
1,191
Статус
В этой теме нельзя размещать новые ответы.
Сверху