Script-uri HTML|CSS: Efect de animatie.

orange.ro

Animatie. Salut, de aici poți descărca script-uri HTML și CSS total gratuit. Pentru astăzi am pregătit un efect de background animat. Sper sa iti placa.

Pentru început adaugă urmatoarele rânduri într-un fișier HTML:

<!DOCTYPE html>
<html>
<head>
<title>Animated Crystal Background CSS Animation Effects</title>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<meta charset=”utf-8″>
</head>
<body>
<section></section>
</body>
</html>

Citeste si: Script-uri HTML|CSS: Efect de Loading Text.

După aceea, intr-un fișier CSS adăugați următoarele:

body {
margin: 0;
padding: 0;
}

section {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: linear-gradient(90deg, #3f51b5, #00bcd4);
animation: animate 20s linear infinite;

}

@keyframes animate {
0% {
filter: hue-rotate(0deg);
}
50% {
filter: hue-rotate(360deg);
}
100% {
filter: hue-rotate(0deg);
}
}

section:before {
content: ”;
position: absolute;
top: 0;
left: 0;
border-top: 100vh solid transparent;
border-left: 100vh solid #fff;
opacity: 0.1;
}

section:after {
content: ”;
position: absolute;
bottom: 0;
right: 0;
border-top: 100vh solid transparent;
border-right: 100vh solid #fff;
opacity: 0.1;
}

Sau poți descărca de aici un fișier RAR care contine background-ul animatie.

Folosește cuponul de reducere QUICK456 pentru 3% reducere pe QuickMobile.ro3% reducere
Folosește cuponul de reducere QUICK456 pentru 3% reducere pe QuickMobile.ro
Cuponul QUICK456 îți aduce 3% reducere pe site-ul QuickMobile.ro indiferent de valoare comenzii. Reducerea se poate acumula și cu alte reduceri existente pe site.
QUICK456
orange.ro

Latest articles

Vodafone a anunțat Vodafone TV, un serviciu de televiziune digitală.

Vodafone inovează și lansează Vodafone TV. Vodafone TV e un serviciu de televiziune digitală. La baza acestiu serviciu stă un dispozitiv de...

PC Garage te echipează gratuit cu un SSD

PC Garage are o nouă campanie pe componente care e întitulată: „Te echipam gratuit: SSD cadou”! Pentru a participa...

iPhone 12 fără ecran de 120Hz

Ok. iPhone e unul dintre cele mai vândute telefoane, Apple are un profit uriaș, apple nu inovează în design-ul telefoanelor, deci economisește...

Cum activezi dark mode-ul pe Facebook?

Facebook a primit o nouă interfață pe desktop, una care conține și o temă întunecată, dar pe mobil, Facebook pare să fie...

Related articles

Leave a reply

Please enter your comment!
Please enter your name here

Acest sit folosește Akismet pentru a reduce spamul. Află cum sunt procesate datele comentariilor tale.