fin sceance

This commit is contained in:
OMGiTzPomPom 2022-09-21 16:43:44 +02:00
parent 1b601ca582
commit 42379c617d
2 changed files with 154 additions and 0 deletions

71
tp1/css/style.css Normal file
View 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
View 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 lexpertise 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>