fin sceance
This commit is contained in:
parent
1b601ca582
commit
42379c617d
71
tp1/css/style.css
Normal file
71
tp1/css/style.css
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
height: 135px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header.logo {
|
||||||
|
float: left;
|
||||||
|
width: 298px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header nav {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
header nav ul {
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 135px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header nav ul li {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0px 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
header nav .connexion {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: unset;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.btn {
|
||||||
|
display: inline;
|
||||||
|
border-radius: 15px;
|
||||||
|
padding: 8px 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary {
|
||||||
|
background: #3B6D56;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn.btn-secondary {
|
||||||
|
background: #79BD9D;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-white {
|
||||||
|
background: #ffffff;
|
||||||
|
color: #3B6D56;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-green {
|
||||||
|
background: #00ED93;
|
||||||
|
color: #3B6D56;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-price {
|
||||||
|
text-size-adjust: 2em;
|
||||||
|
text-decoration: solid;
|
||||||
|
border-radius: 20px;
|
||||||
|
padding: 10px 5px 10px 5px;
|
||||||
|
background: #00ED93;
|
||||||
|
color: #3B6D56;
|
||||||
|
}
|
83
tp1/index.html
Normal file
83
tp1/index.html
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>LP SIGD IOTIA</title>
|
||||||
|
<link href="./css/style.css" rel="stylesheet" />
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="header">
|
||||||
|
<p class="header-logo">
|
||||||
|
<img src="./img/logo.png" alt="Logo Analytics Software" class="header-logo" />
|
||||||
|
</p>
|
||||||
|
<nav class="main-navbar">
|
||||||
|
<ul>
|
||||||
|
<li class="link"><a href=".">Accueil</a></li>
|
||||||
|
<li class="link"><a href="#presentation">Présentation</a></li>
|
||||||
|
<li class="link"><a href="#offres">Nos offres</a></li>
|
||||||
|
<li class="link"><a href="#contact">Contact</a></li>
|
||||||
|
</ul>
|
||||||
|
<p class="connexion"><a href="./connexion.html" class="btn btn-primary">Connexion</a></p>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<div id="page">
|
||||||
|
<section class="section" id="carousel">
|
||||||
|
<p>Logiciel professionnel</p>
|
||||||
|
<h1 class="title">Le meilleur de l’expertise dans un logiciel, avec un maximum de relationnel !</h1>
|
||||||
|
<h2 class="branding">Une solution innovante qui séduit unanimement notre comité de professionnels.</h2>
|
||||||
|
<p><a href="#" class="btn btn-secondary">Souscrire</a></p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="#presentation">
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section" id="personnae">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section" id="offres">
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section" id="contact">
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<div class="footer-col-1">
|
||||||
|
<h3>À propos</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="#">Conditions générales de vente</a></li>
|
||||||
|
<li><a href="#">Politique de confidentialité</a></li>
|
||||||
|
<li><a href="#">Mention légales</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="footer-col-2">
|
||||||
|
<h3>Newsletter</h3>
|
||||||
|
<p>Inscrivez-vous ici pour recevoir les nouveautés par mail :</p>
|
||||||
|
<form id="newsletters">
|
||||||
|
<input type="text" placeholder="Votre adresse mail" />
|
||||||
|
<p><a href="#" class="btn btn-secondary">S'inscrire</a></p>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
<div class="footer-col-3">
|
||||||
|
<h3>Nous suivre</h3>
|
||||||
|
<p>
|
||||||
|
<i>instagram</i>
|
||||||
|
<i>facebook</i>
|
||||||
|
<i>linkdin</i>
|
||||||
|
</p>
|
||||||
|
<h3>Nous écrire</h3>
|
||||||
|
<p>analitycs.software@gmail.com</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
x
Reference in New Issue
Block a user