From 314c61f87c35d6f141aef283aecec2db0767669e Mon Sep 17 00:00:00 2001 From: "serny.s" Date: Sun, 17 Apr 2022 17:55:10 +0200 Subject: [PATCH] commit css --- machine.html | 29 ++++++++++++++++------------- stylepagecss/style.css | 41 ++++++++++++++++++++++------------------- 2 files changed, 38 insertions(+), 32 deletions(-) diff --git a/machine.html b/machine.html index b87a4d6..81b8408 100644 --- a/machine.html +++ b/machine.html @@ -1,6 +1,6 @@ - + - + Machine à sous NSI - + - +
MACHINE A SOUS NSI
-
+
+

machine coins :

+

player coins :

+ +

+
+
-
+
-
-
-

machine coins :

-

player coins :

- -

+
+ +

Règles du jeu
Vous allez insérer le nombre de jeton que vous possédez
@@ -52,7 +55,7 @@ etc... Dans tous les cas sauf le jackpot, le joueur perd sa mise
Bien évidemment, pour ne pas vous anarquer, si le bac possède moins de 500 jetons, alors le jeu s'arrêtera
Et puis il faut également pas oublier que si vous n'avez plus de jeton, alors vous ne pourrez plus jouer

- + diff --git a/stylepagecss/style.css b/stylepagecss/style.css index e321202..ad6fd86 100644 --- a/stylepagecss/style.css +++ b/stylepagecss/style.css @@ -1,21 +1,9 @@ * { margin: 0; padding: 0; + box-sizing: border-box; } -/* le fond avec un gradient*/ -body { - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - min-height: 100vh; - background: rgb(18,79,96); - background: -moz-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); - background: -webkit-linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); - background: linear-gradient(180deg, rgba(18,79,96,1) 0%, rgba(84,33,163,1) 100%); - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#124f60",endColorstr="#5421a3",GradientType=1); -} /* lien "machine à sous NSI" qui nous mène vers la page avec l'interface graphique de la machine à sous*/ a { @@ -38,10 +26,11 @@ a:hover { transition: 3s; text-shadow: 20px 10px 10px black, 0 0 25px blue, 0 0 5px darkblue; } +/* le fond avec un gradient*/ body { display: flex; align-items: center; - justify-content: center; + justify-content: space-around; flex-direction: column; min-height: 100vh; background: rgb(18,79,96); @@ -107,17 +96,31 @@ button:hover { transition: all 0.7s; } +.mise { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; +} +.mise > * { + padding: 5px; +} +.mise label { + font-size: 18px; +} +.mise input { + filter: invert(1); + border-radius: 2%; +} + /* affichage des "coin player et machine" */ .option { - position: absolute; display: flex; justify-content: center; align-items: center; flex-direction: column; - top: 50%; - right: 3%; - transform: translateY(-50%); - color: white; + color: white; + height: 40vh; } /* titre qui renvoie à la page index.html */