Changes : navbar, terminator page, search result
This commit is contained in:
Kybo
parent
425aa11189
commit
7a038b0ae3
19 changed files with 314 additions and 104 deletions
BIN
Images/Icones/smiley.png
Normal file
BIN
Images/Icones/smiley.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 73 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 278 KiB After Width: | Height: | Size: 229 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 188 KiB After Width: | Height: | Size: 126 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 315 KiB After Width: | Height: | Size: 276 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 222 KiB After Width: | Height: | Size: 193 KiB |
|
|
@ -16,13 +16,14 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
</div>
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
<div id="content">
|
||||
<table id="basket">
|
||||
<tr>
|
||||
<tr id="cent">
|
||||
<th>Nom Produit</th><th>Quantité</th><th>Prix</th>
|
||||
</tr>
|
||||
<tr>
|
||||
|
|
|
|||
|
|
@ -15,15 +15,17 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
</div>
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div id="Merci">
|
||||
<h1>Merci beaucoup d'avoir commmander sur notre site ! Votre commande arrive bientôt !</h1>
|
||||
<img src="Images/Produits/pouce.png" alt>
|
||||
<img src="Images/Icones/smiley.png" alt>
|
||||
<h2><a href="index.html">Retourner a l'accueil</a></h2>
|
||||
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div id="acces">
|
||||
<table>
|
||||
|
|
|
|||
|
|
@ -11,19 +11,20 @@
|
|||
|
||||
<nav id="nav">
|
||||
<div class="topnav">
|
||||
<a id ="kyflo" class="active" href="#home">KyFlo</a>
|
||||
<a id ="kyflo" class="active" href="index.html">KyFlo</a>
|
||||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
</div>
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div id="Merci">
|
||||
<h1>Merci beaucoup pour votre réponse ! Votre commentaire a été pris en compte !</h1>
|
||||
<img src="Images/Produits/pouce.png" alt>
|
||||
<h2><a href="index.html">Retourner a l'accueil</a></h2>
|
||||
|
||||
<div id="content">
|
||||
<div id="Merci">
|
||||
<h1>Merci beaucoup pour votre réponse ! Votre retour a été pris en compte !</h1>
|
||||
<img src="Images/Icones/smiley.png" alt>
|
||||
<h2><a href="index.html">Retourner a l'accueil</a></h2>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<div id="acces">
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
175
css.css
175
css.css
|
|
@ -66,10 +66,32 @@ a#nous{
|
|||
float : right;
|
||||
width : 18.5%;
|
||||
padding : 1.2vw 1vw;
|
||||
border-left: 0.2vw solid rgb(204, 25, 25);
|
||||
border-left: 0.15vw solid rgb(204, 25, 25);
|
||||
margin-right: -13%;
|
||||
}
|
||||
|
||||
#loupe{
|
||||
float: right;
|
||||
display: block;
|
||||
color: rgb(255, 255, 255);
|
||||
text-align: center;
|
||||
margin-top: 1.2vw;
|
||||
margin-right: 2vw;
|
||||
padding: 0.95vw;
|
||||
border: 0.1vw solid rgb(204,25,25);
|
||||
text-decoration: none;
|
||||
font-size: 2vw;
|
||||
font-weight: bold;
|
||||
transform: none;
|
||||
border-left: none;
|
||||
background-color: rgb(204, 25, 25);
|
||||
}
|
||||
|
||||
#loupe:hover{
|
||||
color: rgb(0, 0, 0);
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
.topnav {
|
||||
overflow: hidden;
|
||||
background-color: rgba(22, 22, 22, 0.61);
|
||||
|
|
@ -111,7 +133,7 @@ a#nous{
|
|||
.topnav input[type=text] {
|
||||
float: right;
|
||||
padding: 1vw;
|
||||
margin-right: 16px;
|
||||
width: 40%;
|
||||
border: 0.1vw solid rgb(204, 25, 25);
|
||||
font-size: 2vw;
|
||||
margin-top: 1.2vw;
|
||||
|
|
@ -119,32 +141,7 @@ a#nous{
|
|||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.topnav a, .topnav input[type=text] {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: left;
|
||||
width: 87%;
|
||||
margin: 0;
|
||||
padding: 2vw;
|
||||
border: none;
|
||||
transform: none;
|
||||
}
|
||||
.topnav a#panier, a#nous{
|
||||
border: none;
|
||||
}
|
||||
|
||||
.topnav a#nous:hover, a#contactN:hover{
|
||||
padding : 2.4vw 2vw;
|
||||
}
|
||||
|
||||
.topnav input[type=text] {
|
||||
border: 1px solid rgb(190, 73, 73);
|
||||
}
|
||||
}
|
||||
|
||||
/*======================================*/
|
||||
|
||||
/*FOOTER*/
|
||||
|
||||
footer{
|
||||
|
|
@ -213,9 +210,42 @@ td#contact{
|
|||
width: 100%;
|
||||
}
|
||||
/*======================================*/
|
||||
/*FLEX CONTAINER*/
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.flex-container > div {
|
||||
background-color: rgba(59, 59, 59, 0.5);
|
||||
width: 47%;
|
||||
margin: 1vw;
|
||||
text-align: center;
|
||||
line-height: 5vw;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.flex-container>div>a>h3{
|
||||
text-align: left;
|
||||
font-size : 3vw;
|
||||
margin-left: 35%;
|
||||
color : lightgrey;
|
||||
}
|
||||
|
||||
.flex-container>div>a>h4{
|
||||
text-align: left;
|
||||
font-size : 2vw;
|
||||
margin-left: 35%;
|
||||
color : lightgrey;
|
||||
}
|
||||
|
||||
.flex-container>div>a>img{
|
||||
width: 30%;
|
||||
margin-top: 10%;
|
||||
}
|
||||
/*==========================================*/
|
||||
/* CSS Confirmation commentaire */
|
||||
/*CONFIRMATION COMMENTAIRE*/
|
||||
#Merci>h1{
|
||||
font-size: 2.8vw;
|
||||
color : white;
|
||||
|
|
@ -263,6 +293,11 @@ td#contact{
|
|||
margin-left: 25%;
|
||||
}
|
||||
|
||||
|
||||
#Produit>h2#barre{
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
#Produit>h2{
|
||||
text-align: left;
|
||||
font-size : 3vw;
|
||||
|
|
@ -314,21 +349,9 @@ td#contact{
|
|||
border: 0.1vw solid red;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
margin-top: 8vw;
|
||||
padding: 2vw 2vw;
|
||||
}
|
||||
|
||||
table#mosaique{
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
table#mosaique>tr{
|
||||
border :0.1vw solid rgb(204, 25, 25);
|
||||
height: 20%;
|
||||
}
|
||||
|
||||
table#mosaique>tr>td>img{
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
img{
|
||||
width: 30%;
|
||||
|
|
@ -394,6 +417,7 @@ h3:hover{
|
|||
#Client>div{
|
||||
margin-bottom: 3%;
|
||||
border-bottom: 0.1vw solid rgb(134, 134, 134);
|
||||
margin-right: 8%;
|
||||
}
|
||||
|
||||
/*================================================*/
|
||||
|
|
@ -402,6 +426,7 @@ h3:hover{
|
|||
width : 100%;
|
||||
border-top : 0.2vw solid rgb(204,25,25);
|
||||
margin-top: 5%;
|
||||
padding: 2vw 2vw;
|
||||
}
|
||||
|
||||
#Coms>h1{
|
||||
|
|
@ -416,8 +441,9 @@ h3:hover{
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
#Coms>form{
|
||||
margin-left: 25%;
|
||||
#Coms{
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border: 0.1vw solid rgb(204, 25, 25);
|
||||
}
|
||||
|
||||
#Coms>form>h1{
|
||||
|
|
@ -551,7 +577,9 @@ form[action="commande.html"]>input[type=text], select {
|
|||
}
|
||||
|
||||
#livraison {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border: 0.1vw solid rgb(204, 25, 25);
|
||||
margin-top: 5vw;
|
||||
}
|
||||
|
||||
input[type=number], select{
|
||||
|
|
@ -560,7 +588,14 @@ input[type=number], select{
|
|||
|
||||
table#basket{
|
||||
margin-top: 5vw;
|
||||
background-color: rgba(0, 0, 0, 0.5)
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-align: center;
|
||||
border: 0.1vw solid rgb(204, 25, 25);
|
||||
}
|
||||
|
||||
tr#cent>th{
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
td#total{
|
||||
|
|
@ -626,4 +661,54 @@ tr#equ>td{
|
|||
tr#equ>td>img{
|
||||
float: none;
|
||||
border: 0.2vw solid rgb(204, 25, 25);
|
||||
}
|
||||
|
||||
/*=========================*/
|
||||
/*====================================*/
|
||||
/*PARTIE RESPONSIVE*/
|
||||
@media screen and (max-width: 600px) {
|
||||
.topnav a, .topnav input[type=text] {
|
||||
float: none;
|
||||
display: block;
|
||||
text-align: left;
|
||||
width: 76.5%;
|
||||
margin: 0;
|
||||
padding: 2vw;
|
||||
border: none;
|
||||
transform: none;
|
||||
}
|
||||
.topnav a#panier, a#nous{
|
||||
border: none;
|
||||
}
|
||||
|
||||
.topnav a#nous:hover, a#contactN:hover{
|
||||
padding : 2.4vw 2vw;
|
||||
}
|
||||
|
||||
a#loupe{
|
||||
width: 5%;
|
||||
border-left: 0.1vw solid rgb(204,25,25)
|
||||
}
|
||||
|
||||
.topnav input[type=text] {
|
||||
border: 1px solid rgb(190, 73, 73);
|
||||
}
|
||||
.flex-container > div {
|
||||
width: 85%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.flex-container>div>a>img{
|
||||
width: 20%;
|
||||
margin-top: 3%;
|
||||
margin-left: 10%;
|
||||
}
|
||||
.flex-container>div>a>h3, .flex-container>div>a>h4{
|
||||
margin-left: 50%;
|
||||
}
|
||||
#content{
|
||||
margin-left: 2vw;
|
||||
margin-right: 2vw;
|
||||
}
|
||||
|
||||
}
|
||||
33
index.html
33
index.html
|
|
@ -17,7 +17,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site...">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
|
@ -31,7 +32,7 @@
|
|||
<a href="nao.html"><img src="Images/Promotions/promo1.png" alt></a>
|
||||
<a href="pepper.html"><img src="Images/Promotions/promo2.png" alt></a>
|
||||
<a href="r2d2.html"><img src="Images/Promotions/promo3.png" alt></a>
|
||||
<a href="trompettiste.html"><img src="Images/Promotions/promo4.png" alt></a>
|
||||
<a href="terminator.html"><img src="Images/Promotions/promo4.png" alt></a>
|
||||
<a href="nao.html"><img src="Images/Promotions/promo1.png" alt></a>
|
||||
</figure>
|
||||
</div>
|
||||
|
|
@ -39,24 +40,16 @@
|
|||
<div id="content">
|
||||
<div id="produits">
|
||||
<h1>Tout nos produits :</h1>
|
||||
<table id="mosaique">
|
||||
<tr>
|
||||
<td><a href="#"><img src="Images/Produits/soldat.png" alt><h3>Robot soldat</h3><h4>200€</h4></a></td>
|
||||
<td><a href="#"><img src="Images/Produits/romeo.png" alt><h3>Robot romeo</h3><h4>100€</h4></a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="#"><img src="Images/Produits/cat.png" alt><h3>Robot chat</h3><h4>80€</h4></a></td>
|
||||
<td><a href="#"><img src="Images/Produits/r2d2.png" alt><h3>Robot r2d2</h3><h4>500€</h4></a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="#"><img src="Images/Produits/jaune.png" alt><h3>Robot fun</h3><h4>50€</h4></a></td>
|
||||
<td><a href="#"><img src="Images/Produits/valkyrie.png" alt><h3>Robot valkyrie</h3><h4>300€</h4></a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="#"><img src="Images/Produits/pepper.png" alt><h3>Robot Pepper</h3><h4>15 000€</h4></a></td>
|
||||
<td><a href="#"><img src="Images/Produits/terminator.png" alt><h3>Robot Terminator</h3><h4>50 000€</h4></a></td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="flex-container">
|
||||
<div><a href="#"><img src="Images/Produits/soldat.png" alt><h3>Robot soldat</h3><h4>200€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/romeo.png" alt><h3>Robot romeo</h3><h4>100€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/cat.png" alt><h3>Robot chat</h3><h4>80€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/r2d2.png" alt><h3>Robot r2d2</h3><h4>500€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/jaune.png" alt><h3>Robot champion</h3><h4>50€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/valkyrie.png" alt><h3>Robot valkyrie</h3><h4>300€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/pepper.png" alt><h3>Robot Pepper</h3><h4>15 000€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/terminator.png" alt><h3>Robot Terminator</h3><h4>50 000€</h4></a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
|
|
|
|||
3
nao.html
3
nao.html
|
|
@ -18,7 +18,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -17,7 +17,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,8 @@
|
|||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<input type="text" placeholder="Rechercher...">
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
|
|
|
|||
|
|
@ -5,8 +5,56 @@
|
|||
<meta charset="utf-8" />
|
||||
<title>Kyflo</title>
|
||||
<link rel="stylesheet" type="text/css" href="css.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav id="nav">
|
||||
<div class="topnav">
|
||||
<a id ="kyflo" class="active" href="index.html">KyFlo</a>
|
||||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site...">
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
<div id="content">
|
||||
<div id="produits">
|
||||
<h1>Résultats pour la recherche "robot guerrier":</h1>
|
||||
<div class="flex-container">
|
||||
<div><a href="#"><img src="Images/Produits/soldat.png" alt><h3>Robot soldat</h3><h4>200€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/valkyrie.png" alt><h3>Robot valkyrie</h3><h4>300€</h4></a></div>
|
||||
<div><a href="#"><img src="Images/Produits/terminator.png" alt><h3>Robot Terminator</h3><h4>50 000€</h4></a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<div id="acces">
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="index.html">Accueil</a></td>
|
||||
<td><a href="index.html#slider">Nos Promotions</a></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="index.html#produits">Nos Produits</a></td>
|
||||
<td><a href="checkout.html">Votre panier</a></td>
|
||||
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
93
terminator.html
Normal file
93
terminator.html
Normal file
|
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="fr" xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Kyflo</title>
|
||||
<link rel="stylesheet" type="text/css" href="css.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
|
||||
|
||||
</head>
|
||||
<body id="produit">
|
||||
|
||||
|
||||
<nav id="nav">
|
||||
<div class="topnav">
|
||||
<a id ="kyflo" class="active" href="index.html">KyFlo</a>
|
||||
<a id ="nous" href="nous.html">A propos</a>
|
||||
<a id ="contactN" href="contact.html">Contact</a>
|
||||
<a id ="panier" href="checkout.html"><img src="Images/cart.png" alt></a>
|
||||
<a id="loupe" href="search_result.html">GO</a>
|
||||
<input type="text" placeholder="Rechercher sur tout le site">
|
||||
</div>
|
||||
</nav>
|
||||
<button id="hautPage" onclick="window.location.href='#nav'"><img src="Images/arrow.png" alt></button>
|
||||
|
||||
<div id="content">
|
||||
<div id="Produit">
|
||||
<img src="Images/Produits/terminator.png" alt>
|
||||
<h1>ROBOT TERMINATOR</h1>
|
||||
<button>Ajouter au panier</button>
|
||||
<h2>50 000€</h2>
|
||||
<h3>Le robot terminator est idéal si vous envisagez de conquérir la planète !</h3>
|
||||
</div>
|
||||
<div id="Carac">
|
||||
<h1>Caractéristiques du robot :</h1>
|
||||
<h2>Terminator est équipé de nombreux lazers et est doté d'une IA des plus avancée.</h2>
|
||||
<h2>Son design humanoide lui permet de se fondre dans la masse une fois habillé !</h2>
|
||||
<h2>Il peut controler l'esprit des autres personnes grâce aux ondes qu'il emet.</h2>
|
||||
</div>
|
||||
<div id="Coms">
|
||||
<h1>Commentaires clients :</h1>
|
||||
<div id="Client">
|
||||
<div>
|
||||
<img src="Images/Produits/avatarF.png" alt>
|
||||
<h1>Aude Fousi</h1>
|
||||
<h3>Robot trop effrayant et trop cher !</h3>
|
||||
</div>
|
||||
<div>
|
||||
<img src="Images/Produits/avatarH.png" alt>
|
||||
<h1>Pierre Tarte</h1>
|
||||
<h3>Superbe robot, je vais pouvoir mettre mon plan de coup d'état a éxécution...</h3>
|
||||
</div>
|
||||
</div>
|
||||
<h2>Laissez nous un commentaire :</h2>
|
||||
<form action="commentaire.html">
|
||||
<h1>Nom et Prénom :</h1>
|
||||
<input type="text" required>
|
||||
|
||||
<h1>Email :</h1>
|
||||
<input type="text" required>
|
||||
|
||||
<h1>Commentaire:</h1>
|
||||
<input type="text" placeholder="Commentaire" required>
|
||||
|
||||
<h1 id="valider">Valider:</h1>
|
||||
<input type="submit" value="Envoyer">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<div id="acces">
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>Accès rapide</th><th id="line"></th><th>Une question ?</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="index.html">Accueil</a></td>
|
||||
<td><a href="index.html#slider">Nos Promotions</a></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="index.html#produits">Nos Produits</a></td>
|
||||
<td><a href="checkout.html">Votre panier</a></td>
|
||||
<td id="contact"><button onclick="window.location.href='contact.html'" id="contactB">Nous contacter</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Kyflo</title>
|
||||
<link rel="stylesheet" type="text/css" href="css.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav>
|
||||
<a href="index.html"><img src="Images/logo.png" alt></a>
|
||||
<a href="checkout.html"><img id="panier" src="Images/cart.png" alt></a>
|
||||
|
||||
</nav>
|
||||
</body>
|
||||
</html>
|
||||
Reference in a new issue