Webleb - Snippet di Codice -

2079 pan4o

Apri nell'Editor Pubblica il Tuo Codice

Consigliato

24 September 2025

Frammento HTML di animazione cerebrale CSS

16 September 2025

Carosello di carte 3D HTML CSS JavaScript

25 April 2025

Un codice di Metehan

HTML

CSS

body {
margin: 0;
display: flex;
flex-direction: column;
align-items: center;
height: 100vh;
justify-content: center;
font-family: cursive;
background-color: slateblue;
overflow: hidden;
#credits {position: fixed; bottom: 10px; right: 10px; color: black; font-size: 12px; font-family: Arial, sans-serif;}
}
h2 {
color: white;
text-align:center;
text-transform: uppercase; 
letter-spacing: 4px;   
}
.year {
font-size: 5em;
color: white;
font-weight: bold;
}
.countdown {
margin: 30px;
background-color: rgba(0, 0, 0, 0.1);
width: 100%; 
color: white;
height: 120px;
display: flex;
justify-content: center;
align-items: center;
}
.countdown div {
 margin: 0 15px;
 font-size: 2.5em;
 font-weight: 500;
 margin-top: -25px;
 position: relative;
 text-align: center;
 width: 100px;
}
.countdown div::before {
content: "";
position: absolute;
bottom: -30px;
left: 0;
font-size: 0.35em;
line-height: 35px;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 500;
width: 100%;
height: 35px;
}

.countdown #day::before {
 content: "Days";   
}
.countdown #hour::before {
    content: "Hours";   
   }
   .countdown #minute::before {
    content: "Minutes";   
   }
   .countdown #second::before {
    content: "Seconds";   
   }

Consigliato

Frammento HTML di animazione cerebrale CSS

Carosello di carte 3D HTML CSS JavaScript

Un codice di Metehan

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS