Structure du sommaire

main
DahmaneYanis 2 years ago
parent e491de4b2d
commit 61b4a4e8e9

@ -1,21 +1,41 @@
/*
=======================================
Général
=======================================
*/
body{ body{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
h1 .conteneur
{ {
font-size : 60px; display: flex;
}
/*
=========================================
Titre SAE
=========================================
*/
#SAE
{
font-size : 70px;
margin : 10px; margin : 10px;
} }
h2 #DECOUVERTE
{ {
font-size : 30px; font-size : 38px;
margin-top : 10px; margin-top : 10px;
} }
.titreSAE
{
border : 1px solid red;
}
header header
{ {
display : flex; display : flex;
@ -23,19 +43,94 @@ header
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
border : 1px solid green; border : 1px solid green;
width: 80%; width: 82%;
margin-bottom : 15px; margin-bottom : 15px;
} }
.titreSAE /*
========================================
Sommaire
========================================
*/
#sommaire
{ {
width : 82%;
display: flex;
flex-direction: column;
border : 1px solid black;
}
#titreSommaire
{
font-size: 33px;
margin-left: 20px;
}
#liensQuestions
{
justify-content: space-around;
flex-direction: row;
padding-top : 15px;
padding-bottom: 15px;
width : 95%;
align-self : center;
margin-bottom: 30px;
border : 1px solid red; border : 1px solid red;
} }
.blocLienQuestion
{
border : 1px solid orange;
}
.lienQuestion
{
display: flex;
flex-direction: column;
justify-content: center;
width : 100%;
height: 100%;
text-decoration: none;
color : black;
border : 1px solid green;
}
.titreLien
{
padding-left : 10px;
padding-right : 10px;
font-size: 22px;
}
/*
table table
{ {
border-collapse: collapse; border-collapse: collapse;
} }
td{ td{
border : 1px solid black; border : 1px solid black;
} font-size : 25px;
display: inline-block;
}
.questionP
{
text-align: center;
border : 1px solid purple;
}
.question
{
border: 3px solid orange;
display: block;
width : 100%;
margin : 0px;
}
*/

@ -8,43 +8,95 @@
<body> <body>
<header> <header>
<h1 class="titreSAE">SAE 01-06</h1> <h1 class="titreSAE" id="SAE">SAE 01-06</h1>
<h2 class="titreSAE">DÉCOUVERTE DE L'ENVIRONNEMENT ÉCONOMIQUE ET ÉCOLOGIQUE - LMC</h1> <h2 class="titreSAE" id="DECOUVERTE">DÉCOUVERTE DE L'ENVIRONNEMENT ÉCONOMIQUE ET ÉCOLOGIQUE - LMC</h1>
</header> </header>
<section id="sommaire"> <section id="sommaire">
<table id="sommaireTableau"> <h1 id="titreSommaire">Sommaire</h1>
<tr>
<a class="question" href=""> <div class="conteneur" id="liensQuestions">
<td> <div class="blocLienQuestion">
<a class="lienQuestion" href="#q1">
<p class="titreLien">
Les caractéristiques des demandeurs et des autres offreurs et <br/> Les caractéristiques des demandeurs et des autres offreurs et <br/>
les autres acteurs économiques concernés par notre activité les autres acteurs économiques concernés par notre activité
</td> </p>
</a> </a>
<a class="question" href=""> </div>
<td>
<div class="blocLienQuestion">
<a class="lienQuestion" href="#q1">
<p class="titreLien">
Le SWOT Le SWOT
</td> </p>
</a> </a>
</tr> </div>
<tr>
<a class="question" href=""> <div class="blocLienQuestion">
<td> <a class="lienQuestion" href="#q1">
<p class="titreLien">
L'empreinte carbone de notre entreprise L'empreinte carbone de notre entreprise
</td> </p>
</a> </a>
<a class="question" href=""> </div>
<td>
<div class="blocLienQuestion">
<a class="lienQuestion" href="#q1">
<p class="titreLien">
La question complémentaire La question complémentaire
</td> </p>
</a> </a>
</div>
</div>
<!--
<table id="sommaireTableau">
<tr>
<td>
<a class="question" href="#q1">
<p class="questionP">
Les caractéristiques des demandeurs et des autres offreurs et <br/>
les autres acteurs économiques concernés par notre activité
</p>
</a>
</td>
<td>
<a class="question" href="#q1">
<p class="questionP">
Le SWOT
</p>
</a>
</td>
</tr>
<tr>
<td>
<a class="question" href="#q1">
<p class="questionP">
L'empreinte carbone de notre entreprise
</p>
</a>
</td>
<td>
<a class="question" href="#q1">
<p class="questionP">
La question complémentaire
</p>
</a>
</td>
</tr> </tr>
</table> </table>
-->
</section> </section>
<section id="questions"> <section id="questions">
<div id="q1"> <div id="q1">
<p>Hello WORLD</p>
</div> </div>
<div id="q2"> <div id="q2">

Loading…
Cancel
Save