izanic/SAE_WEB_S1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bouton

Browse Source
This commit is contained in:
gallego 2024-01-15 18:47:24 +01:00
parent 6bd14652d7
commit 9574f601f9
3 changed files with 44 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
CSS/styles.css
View File

@ -60,8 +60,44 @@ nav{
} }
.button {
width: 9.5em;
height: 2.3em;
margin: 0.5em;
background: rgb(255, 0, 0);
color: rgb(0, 0, 0);
border: none;
border-radius: 1.625em;
font-size: 20px;
font-weight: bold;
cursor: pointer;
position: relative;
z-index: 1;
overflow: hidden;
}
.button:hover {
color: rgb(255, 0, 0);
}
.button:after {
content: "";
background: rgb(0, 0, 0);
position: absolute;
z-index: -1;
left: -20%;
right: -20%;
top: 0;
bottom: 0;
transform: skewX(-45deg) scale(0, 1);
transition: all 0.5s;
}
.button:hover:after {
transform: skewX(-45deg) scale(1, 1);
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
#icone{ #icone{

BIN
img/163662-poker-roulette-carte_a_jouer-poker_en_ligne-jeu_de_cartes-3840x2160.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

14
index.html
View File

@ -8,7 +8,7 @@
<link rel = "stylesheet" type = "text/css" href = "CSS/styles.css"> <link rel = "stylesheet" type = "text/css" href = "CSS/styles.css">
<meta name="keywords" content="casino"> <meta name="keywords" content="casino">
<link rel = "icon" type = "image/png" href = "img/icon.png"> <link rel = "icon" type = "image/png" href = "img/logo.svg">
</head> </head>
<body> <body>
@ -18,21 +18,21 @@
<nav> <nav>
<a href="#"><img id="icone" src="img/roulette_coeur.png" alt="icone du site"></a> <a href="#"><img id="icone" src="img/logo.svg" alt="icone du site"></a>
<ul> <ul>
<li> <a href= "#" class="page" id="page_courante"><p>Accueil</p> </a></li> <li> <a href= "index.html" class="page" id="page_courante"><button class="button" type="buton" value="Accueil"> Accueil</button></a></li>
<li> <a href= "HTML/page_2.html" class="page" ><p>Nos jeux</p> </a></li> <li> <a href= "HTML/page_2.html" class="page" ><button class="button" type="buton" value="Nos jeux">Nos jeux</button> </a></li>
<li> <a href= "HTML/page_3.html" class="page"><p>Nos partenaires</p> </a> </li> <li> <a href= "HTML/page_3.html" class="page"><button class="button" type="buton" value="Nos partenaires">Nos partenaires</button> </a> </li>
<li> <a href= "HTML/page_4.html" class="page"><p>A propos de nous </p> </a></li> <li> <a href= "HTML/page_4.html" class="page"><button class="button" type="buton" value="A propos de nous"> A propos de nous</button> </a></li>
</ul> </ul>
</nav> </nav>
</header> </header>
<main> <main>
<img id="presentation" src="img/casion_background.jpeg" alt="icone du site"> <img id="presentation" src="img/163662-poker-roulette-carte_a_jouer-poker_en_ligne-jeu_de_cartes-3840x2160.jpg" alt="icone du site">
<h1><span class="txt_rouge">Casino du Coeur</span></h1> <h1><span class="txt_rouge">Casino du Coeur</span></h1>
<a href="#"><img id="btn_up" src="img/icone/arrow-up.svg" alt="icone de fleche"></a> <a href="#"><img id="btn_up" src="img/icone/arrow-up.svg" alt="icone de fleche"></a>