“Fond animé CSS” Réponses codées

Fond animé CSS

/*
	use @keyframes and the animation property
	see this code running here: https://codepen.io/hylobates-lar/pen/qBbQeON
*/
html, body {
  width: 100%;
  height:100%;
}

body {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

Dark Dotterel

Background d'animation CSS

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
body{
    width: 100vw;
    height: 100vh;
}
div{
    transition: all .3s ease-in-out;
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    height: 500px;
    width: 500px;
}

guiliuri

HTML Background animé

    <video id="video" autoplay="true" loop muted>
      <source src="background.mp4" type="video/mp4"/>
    </video>

moi_crn

Réponses similaires à “Fond animé CSS”

Questions similaires à “Fond animé CSS”

Plus de réponses similaires à “Fond animé CSS” dans CSS

Parcourir les réponses de code populaires par langue

Parcourir d'autres langages de code

Shell/Bash

C++

CSS

HTML

Java

JavaScript

Objective-C

PHP

Python

Sql

Swift

Ruby

TypeScript

Kotlin

Assembly

VBA

Scala

Rust

Dart

Elixir

Clojure

Haskell

Matlab

Erlang

Cobol

Fortran

Scheme

Perl

Groovy

Lua

Julia

Delphi

Abap

Lisp

Prolog

Pascal

ActionScript

Basic

Solidity

PowerShell

GDScript

Excel