Anime

Ceci est une soumission pour Frontend Challenge - Édition de décembre, Glam Up My Markup: Winter Solstice

Ce que j'ai construit

CSS

*{
marge : 0;
remplissage : 0 ;
dimensionnement de la boîte : border-box ;
famille de polices : 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif ;
>

corps{
débordement-x: caché ;
>
.largeur principale{
largeur : 1400px ;
largeur maximale : 95 % ;
marge : 0 auto ;
>
.héros{
hauteur : 100%;
largeur : 100 % ;
hauteur min : 100vh ;
image d'arrière-plan : url (Tanjiro1.png);
taille de l'arrière-plan : 100 % ;
répétition d'arrière-plan : pas de répétition ;
>

.hero en-tête .logo h2 a{
affichage : bloquer ;
taille de police : 30 px ;
poids de la police : 600 ;
décoration de texte : aucune ;
couleur : blanc ;
font-family:'Noto Sans JP', sans-serif;
>

en-tête .hero{
affichage : flex ;
align-items : center;
justifier-contenu : espace-entre ;
remplissage : 40px 0 30px ;

}

nav ul li{
style de liste : aucun ;
affichage : bloc en ligne ;

}

nav ul li a{
décoration de texte : aucun ;
couleur : bleu alice ;
marge gauche : 80px;
taille de police : 20 px ;
poids de la police : 600 ;
border-bottom : 2px blanc uni ;
transition : 4s ;

}

nav ul li:not(:last-child) a:hover
nav ul li:not(:last-child) a:focus{
border-bottom : 2px blanc uni ;

}

nav ul li.active a{
border-bottom : 2px blanc uni ;
>

nav ul li.btn a{
fond : transparent ;
couleur : blanc ;
bordure : 1px solide #f5dca8;
rembourrage : 9px 20px ;
rayon de bordure : 80 px ;
hauteur de ligne : 1,4 ;
taille de police : 18 px ;
poids de la police : 600 ;
marge gauche : 150px;

}

nav ul li.btn : survolez un{
bordure : 1px blanc uni ;
couleur : noir ;
fond : blanc ;
transition : .4s ;

}

.contenu{
rembourrage supérieur : 140 px ;
>

.content .main-text{
position : relative ;
indice z : 2 ;
marge inférieure : 50 px ;

}

.content .main-text h6{
taille de police : 14 px ;
poids de la police : 400 ;
couleur : blanc ;
marge inférieure : 40 px ;

}

.content .main-text h1{
taille de police : 60 px ;
hauteur de ligne : 1;
couleur : blanc ;
marge : 0px 0px 45px ;
font-family : 'Marqueur permanent', cursif ;

}

.content .main-text p{
largeur maximale : 100 % ;
largeur : 480 px ;
couleur : blanc ;
hauteur de ligne : 1,8 ;
taille de la police : 15 px ;
marge inférieure : 50px
>

.content .main-text a{
affichage : bloc en ligne ;
décoration de texte : aucune ;
couleur : noir ;
fond : blanc ;
bordure : 1px blanc uni ;
rembourrage : 9px 25px ;
hauteur de ligne : 1,4 ;
rayon de bordure : 30 px ;
taille de police : 14 px ;
poids de la police : 500 ;

}

.content .main-text a:hover{
transformer : scale(1.2);
bordure : 1px solide #f5dca8;
fond : transparent ;
couleur : blanc ;
transition : .4s ;

}

HTML

Anime

鬼滅の刃

• Saisons
• Épisodes
• Manga
• Jouer maintenant

#1 Meilleur Anime
C'est une série de mangas japonais écrite et illustrée par Koyoharu Gotōge,

Tueur de Démons

Une famille est attaquée par des démons et seuls deux membres survivent : Tanjiro et sa sœur Nezuko, qui se transforme lentement en démon. Tanjiro entreprend de devenir un tueur de démons pour venger sa famille et guérir sa sœur.....

Regardez maintenant

Ceci est mon site Web d'anime exclusif, il a les meilleurs boutons animés et des transitions fluides

Tous les droits Swally m'appartiennent

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!