Kaumeet
This commit is contained in:
KEZEL BENOIT p1907091
parent
b9e8a248a9
commit
e6e4c4ae0d
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 218 KiB After Width: | Height: | Size: 211 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 99 KiB |
|
|
@ -1,4 +1,8 @@
|
|||
body{
|
||||
html{
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body{
|
||||
margin: 0;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
background-image: url("Images/bg.jpg");
|
||||
|
|
@ -18,14 +22,15 @@ a{
|
|||
background-color: white;
|
||||
width: 100%;
|
||||
z-index: 3;
|
||||
overflow: auto;
|
||||
box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);
|
||||
overflow: auto;
|
||||
position: fixed;
|
||||
|
||||
}
|
||||
|
||||
.header ul{
|
||||
margin: 0;
|
||||
padding : 0;
|
||||
list-style: none;
|
||||
list-style: none;
|
||||
overflow: hidden;
|
||||
background-color: white;
|
||||
}
|
||||
|
|
@ -209,20 +214,20 @@ div#slider figure {
|
|||
}
|
||||
|
||||
.flex-container>div>a>p{
|
||||
font-size: 0px;
|
||||
}
|
||||
|
||||
.flex-container .ok:hover a>p{
|
||||
font-size: 40px;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
.content{
|
||||
.flex-container .ok:hover a>img{
|
||||
width: 100%;
|
||||
transition-duration: 0.5s;
|
||||
}
|
||||
|
||||
.title{
|
||||
padding: 5vw 1vw;
|
||||
background-color: rgba(255, 255, 255, 0.548);
|
||||
}
|
||||
|
||||
.content>h1{
|
||||
.title>h1{
|
||||
font-size: 60px;
|
||||
text-align: center;
|
||||
color: rgb(0, 0, 0);
|
||||
|
|
@ -266,4 +271,42 @@ div#slider figure {
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
/*============================================*/
|
||||
/*============================================*/
|
||||
|
||||
/* QUI SOMMES NOUS ?*/
|
||||
.content {
|
||||
background-color: rgb(234, 234, 234);
|
||||
padding: 1vw;
|
||||
}
|
||||
|
||||
|
||||
#nous table{
|
||||
width: 100%;
|
||||
margin-top: 2%;
|
||||
}
|
||||
|
||||
#nous img{
|
||||
display: block;
|
||||
margin: auto;
|
||||
border-radius: 1vw;
|
||||
width: 30%;
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
|
||||
#nous h2{
|
||||
font-size: 40px;
|
||||
padding-top: 2vw;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#nous h3{
|
||||
color: rgb(53, 53, 53);
|
||||
}
|
||||
|
||||
#nous td{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#nous ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,9 @@
|
|||
@media (min-width:48em){
|
||||
@media (min-width:750px){
|
||||
/* NAVBAR */
|
||||
.header{
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.header li{
|
||||
float: left;
|
||||
}
|
||||
|
|
|
|||
28
index.html
28
index.html
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Kyflo - hewo</title>
|
||||
<title>Kyflo</title>
|
||||
<link rel="stylesheet" type="text/css" href="Assets/css.css">
|
||||
<link rel="stylesheet" type="text/css" href="Assets/resp.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
|
||||
|
|
@ -14,12 +14,12 @@
|
|||
|
||||
<body>
|
||||
<header class="header">
|
||||
<a href="/" class="logo">KYFLO</a>
|
||||
<a href="#" class="logo">KYFLO</a>
|
||||
<input class="menu-btn" type="checkbox" id="menu-btn"/>
|
||||
<label class="menu-icon" for="menu-btn"><span class="nav-icon"></span></label>
|
||||
<ul class="menu">
|
||||
<li><input type="text" placeholder="Rechercher..."></li>
|
||||
<li><a href="#">A propos</a></li>
|
||||
<li><a href="#nous">A propos</a></li>
|
||||
<li><a href="#">Contact</a></li>
|
||||
<li><a href="#">Panier</a></li>
|
||||
</ul>
|
||||
|
|
@ -40,10 +40,10 @@
|
|||
</figure>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<div class="title">
|
||||
<h1>Tous nos produits :</h1>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex-container">
|
||||
<div class="ok"><a href="Assets/Pages/Produits/nao.html"><img src="Assets/Images/Produits/nao.png" alt><p>Nao</p></a></div>
|
||||
<div ><div class="rupt">Rutpure de stock</div><a href="#"><img class="out" src="Assets/Images/Produits/valkyrie.png" alt><p>Valkyrie</p></a></div>
|
||||
|
|
@ -53,7 +53,25 @@
|
|||
<div class="ok"><a href="Assets/Pages/Produits/r2d2.html"><img src="Assets/Images/Produits/terminator.png" alt><p>Terminator</p></a></div>
|
||||
</div>
|
||||
|
||||
<div id="nous">
|
||||
<div class="title">
|
||||
<h1>Qui sommes nous ?</h1>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<h2>L'équipe :</h2>
|
||||
<table id="equipe">
|
||||
<tr id="equ">
|
||||
<td><img src="Assets/Images/Sprites/benoit.png" alt></td>
|
||||
<td><h2>Nos engagements :</h2><h3>Etre soucieux de la qualité de nos produits</h3><h3>Vendre des robots à la pointe de la technologie</h3><h3>Respecter l'environnement</h3></td>
|
||||
<td><img src="Assets/Images/Sprites/florian.png" alt></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
Reference in a new issue