bouton
This commit is contained in:
parent
6bd14652d7
commit
9574f601f9
@ -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{
|
||||
|
Binary file not shown.
After Width: | Height: | Size: 2.1 MiB |
14
index.html
14
index.html
@ -8,7 +8,7 @@
|
||||
|
||||
<link rel = "stylesheet" type = "text/css" href = "CSS/styles.css">
|
||||
<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>
|
||||
|
||||
<body>
|
||||
@ -18,21 +18,21 @@
|
||||
<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>
|
||||
|
||||
<li> <a href= "#" class="page" id="page_courante"><p>Accueil</p> </a></li>
|
||||
<li> <a href= "HTML/page_2.html" class="page" ><p>Nos jeux</p> </a></li>
|
||||
<li> <a href= "HTML/page_3.html" class="page"><p>Nos partenaires</p> </a> </li>
|
||||
<li> <a href= "HTML/page_4.html" class="page"><p>A propos de nous </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" ><button class="button" type="buton" value="Nos jeux">Nos jeux</button> </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"><button class="button" type="buton" value="A propos de nous"> A propos de nous</button> </a></li>
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<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>
|
||||
<a href="#"><img id="btn_up" src="img/icone/arrow-up.svg" alt="icone de fleche"></a>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user