|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<!--inclusion du fichier css dans html-->
|
|
<title>Tache sous traitance </title>
|
|
<style>
|
|
div {
|
|
|
|
color: #000000;
|
|
padding: 10px;
|
|
margin : auto;
|
|
font-family: verdana,"Arial Black";
|
|
position: center;
|
|
|
|
|
|
}
|
|
.flex-container {
|
|
display: flex;
|
|
flex-direction: row;
|
|
font-size: 15px;
|
|
padding: 40px;
|
|
width: 340px;
|
|
height: 450px;
|
|
background-color: rgba(250, 250, 250, 0.85);
|
|
position: relative;
|
|
margin-top:20px;;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.Press{
|
|
align-items: center;
|
|
background: #F08080 none repeat scroll 0 0;
|
|
border-radius: 10px;
|
|
display: flex;
|
|
}
|
|
.Temp{
|
|
align-items: center;
|
|
background: #DDA0DD none repeat scroll 0 0;
|
|
border-radius: 10px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
transition: all 2s ease 3s;
|
|
}
|
|
.Humi{
|
|
align-items: center;
|
|
|
|
background: #F08080 none repeat scroll 0 0;
|
|
border-radius: 10px;
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
transition: all 2s ease 3s;
|
|
}
|
|
.Qual{
|
|
align-items: center;
|
|
background: #DDA0DD none repeat scroll 0 0;
|
|
border-radius: 10px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
transition: all 2s ease 3s;
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="flex-container">
|
|
<!-- Header -->
|
|
<header id="Projet" center>
|
|
<a><img src="logo.png" style="width:150px;" ></a>
|
|
|
|
|
|
<h1><b> Projet Serveur Web </b></h1>
|
|
|
|
<div >
|
|
|
|
<!--Pression-->
|
|
<div class="Press">
|
|
<p style="color: black"><strong>Pression </strong></p>
|
|
<!--température en degrés Cilcius -->
|
|
</div></br>
|
|
<!--température-->
|
|
<div class="Temp">
|
|
<p style="color: white"><strong>Température</strong></p> <!--pression en degrés HPa -->
|
|
</div></br>
|
|
<!--Humidité-->
|
|
<div class="Humi">
|
|
<p style="color: black"><strong>Humidité</strong></p>
|
|
|
|
</div> </br>
|
|
<!--Qualité de l'air -->
|
|
<div class="Qual">
|
|
<p style="color: white"><strong> Qualité de l'air </strong></p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</div>
|
|
<!--Code Css pour la mise en forme de la page!-->
|
|
|
|
<style type="text/css">
|
|
|
|
{
|
|
font-family: 'Lato', sans-serif;
|
|
}
|
|
body{
|
|
/*pour la photo de back ground */
|
|
|
|
/*height: 90vh;*/
|
|
display: flex;
|
|
background-color: #FFF0F5;
|
|
|
|
background-image: url('Polytech.jpg' ) ;
|
|
|
|
background-size: cover;
|
|
/* Full height */
|
|
height: 100%;
|
|
/* Center and scale the image nicely */
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
}
|
|
</style>
|
|
</body>
|
