A voir également:
- Comment réaliser ce type d'effet ?
- Effet miroir word - Guide
- Réaliser un organigramme - Guide
- Clear type - Guide
- Comment changer le type de fichier - Guide
- Effet miroir photo - Accueil - Photo
3 réponses
tout est dans la source de la page en question
une div avec class logo
et le css
position : absolute, left : 50%; top:50%; pour centrer sur la page
.logo {
background: url(../img/logo.png);
height: 62px;
width: 57px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -25px;
-webkit-animation: logo 3s linear;
}
une div avec class logo
et le css
position : absolute, left : 50%; top:50%; pour centrer sur la page
.logo {
background: url(../img/logo.png);
height: 62px;
width: 57px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -25px;
-webkit-animation: logo 3s linear;
}
Merci beaucoup de ton aide
Serait-il possible d'avoir le code pour ma page HTML, et CSS ? car j'ai un peu de mal à creer tout ça ...
D'avance je vous remercie.
Serait-il possible d'avoir le code pour ma page HTML, et CSS ? car j'ai un peu de mal à creer tout ça ...
D'avance je vous remercie.
il suffit d'afficher le code source de la page en question :
pour le HTML :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Kevin Kalde - Web/UI Designer</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<div class="logo"></div>
</body>
</html>
pour le CSS :
html {
margin: 0px; padding: 0px;
}
body {
background: url(../img/bg5.png); #414141
}
.logo {
background: url(../img/logo.png);
height: 62px;
width: 57px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -25px;
-webkit-animation: logo 3s linear;
}
@-webkit-keyframes logo {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
c'est pas bien de faire du copier / coller, mais vous pouvez vous en inspirer et l'adapter...
pour le HTML :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Kevin Kalde - Web/UI Designer</title>
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<div class="logo"></div>
</body>
</html>
pour le CSS :
html {
margin: 0px; padding: 0px;
}
body {
background: url(../img/bg5.png); #414141
}
.logo {
background: url(../img/logo.png);
height: 62px;
width: 57px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -25px;
-webkit-animation: logo 3s linear;
}
@-webkit-keyframes logo {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
c'est pas bien de faire du copier / coller, mais vous pouvez vous en inspirer et l'adapter...
