Un code par mironovbogdan341

353 mironovbogdan341

Ouvrir dans l'éditeur Publiez votre code

Recommandé

13 April 2025

Un code par gherhz

16 December 2024

Une page d'accueil aux couleurs de Léon

HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Кнопка RGB переливается</title>
<style>
  /*Общий стиль для тела страницы */
  body {
    display: flex;
    justify-content: center;
    align-items:center;
    height: 100vh;
    background-color: #222;
    margin: 0;
    font-family: Artial, sans-serif;
   /* Стиль для кнопки */
  .rainbow-button {
    padding: 15px 40px;
    font-size: 20px;
    color: #fff;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    background: linear-gradient(270deg, red, orange, yellow, green, blue, indigo, violet);
    background-size: 1400% 1400%;
    animation: rainbow 8s ease-in-out infinite;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    transition: transform 0.2s; box-shadow 0.2s;
  }

/* Эффект при наведении */
  .rainbow-button:hover {
    transform: scale(1.05);
  box-shadow: 0 6px 20px rgba(0,0,0,0.4)
  }

/* Анимация градиента */
  @keyframes rainbow {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }
</style>
</head>
<body>

<button class="rainbow-button">РГБ кнопка</button>

</body>
</html>

Un code par mironovbogdan341

Recommandé

Un code par gherhz

Une page d'accueil aux couleurs de Léon

HTML

CSS

JS

Recommandé

Un code par gherhz

Une page d'accueil aux couleurs de Léon

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS