alexandre.agostinho
/
web-tp-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects 1 Releases Wiki Activity

padd & marg

Browse Source
master
tuks 2 years ago
parent 1090635a03
commit 329dbd133c
4 changed files with 111 additions and 14 deletions
Show Stats Download Patch File Download Diff File

31
index.html
Unescape View File

@ -11,7 +11,6 @@
<body> <body>
<div class="header"> <div class="header">
<div class="title"> <div class="title">
<h1>LangProg - Main</h1> <h1>LangProg - Main</h1>
<img src="img/ProgrammingLanguage1-1.jpg" alt="ImgTitle" /> <img src="img/ProgrammingLanguage1-1.jpg" alt="ImgTitle" />
@ -37,19 +36,33 @@
<article> <article>
<h3>Le C</h3> <h3>Le C</h3>
<p>Le C est un language de programmation.</p> <p>C est un langage de programmation <strong>impératif
généraliste</strong>, de bas niveau. Inventé au début des années 1970
pour réécrire Unix, C est devenu un des langages les plus utilisés,
encore de nos jours.</p>
<a href="./pages/article1.html">Lire la suite...</a> <a href="./pages/article1.html">Lire la suite...</a>
</article> </article>
<article> <article>
<h3>Le C++</h3> <h3>Le C++</h3>
<p>Le C++ est un language de programmation.</p> <p>C++ est un langage de programmation <strong>compilé</strong>
permettant la programmation sous de multiples paradigmes,
<strong>dont la programmation procédurale, la programmation orientée
objet et la programmation générique.</strong> Ses bonnes
performances, et sa compatibilité avec le C en font un des langages
de programmation les plus utilisés dans les applications où la
performance est critique.</p>
<a href="./pages/article2.html">Lire la suite...</a> <a href="./pages/article2.html">Lire la suite...</a>
</article> </article>
<article> <article>
<h3>Le C#</h3> <h3>Le C#</h3>
<p>Le C# est un language de programmation.</p> <p>C# est un langage de programmation <strong>orientée objet</strong>,
fortement typé, dérivé de C et de C++, ressemblant au langage Java.
Il est utilisé pour développer des <strong>applications
web</strong>, ainsi que des <strong>applications de bureau, des
services web, des commandes, des widgets ou des bibliothèques de
classes</strong>.</p>
<a href="./pages/article3.html">Lire la suite...</a> <a href="./pages/article3.html">Lire la suite...</a>
</article> </article>
</section> </section>
@ -58,15 +71,21 @@
<h2>Actualités du site</h2> <h2>Actualités du site</h2>
<article> <article>
<h3>Initialisation du site</h3> <h4>Initialisation du site</h4>
<p>08/09/2022: Création de la page d'acceuil, des 3 premiers articles, <p>08/09/2022: Création de la page d'acceuil, des 3 premiers articles,
et de la table.</p> et de la table.</p>
</article> </article>
<article> <article>
<h3>Ajouts des stylesheets</h3> <h4>Ajouts des stylesheets</h4>
<p>15/09/2022: Ajouts de styles.css.</p> <p>15/09/2022: Ajouts de styles.css.</p>
</article> </article>
<article>
<h4>MAJ complete de la structuration du site</h4>
<p>29/09/2022: Création de multiple fichiers de styles adaptive,
arrangement du code pour une meilleur lisibilité.</p>
</article>
</section> </section>
<aside class="links"> <aside class="links">

24
pages/donnees.html
Unescape View File

@ -1,14 +1,30 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8" \> <meta charset="utf-8" \>
<title>Quelques données</title> <title>Quelques données</title>
<link href="../styles/main.css" rel="stylesheet" type="text/css" />
<link href="../styles/donnees.css" rel="stylesheet" type="text/css" />
</head> </head>
<body> <body>
<p><a href="../index.html">-- Menu principal</a></p>
<div> <div class="header">
<h2>Quelques données...</h2> <div class="title">
<table width="60%" border="1"> <h1>LangProg - Données</h1>
<img src="../img/ProgrammingLanguage1-1.jpg" alt="ImgTitle" />
</div>
<nav>
<a href="./index.html">Menu Principal</a>
<a href="pages/galerie.html">Galerie</a>
<a href="pages/donnees.html">Données</a>
</nav>
</div>
<div class="donnees">
<table>
<tr> <tr>
<th></th> <th></th>
<th><img src="../img/The_C_Programming_Language_logo.svg.png" alt="C" <th><img src="../img/The_C_Programming_Language_logo.svg.png" alt="C"

23
styles/donnees.css
Unescape View File

@ -0,0 +1,23 @@
body {
background-color: #ebebeb;
}
/* TABLE */
.donnees {
margin: 50px;
}
.donnees table {
table-layout: auto;
width: 50%;
border: 1px solid cadetblue;
border-bottom: 0;
border-right: 0;
}
.donnees th,tr,td {
border-bottom: 1px solid cadetblue;
border-right: 1px solid cadetblue;
}

47
styles/main.css
Unescape View File

@ -2,6 +2,17 @@ body {
background-color: #ebebeb; background-color: #ebebeb;
} }
a {
background-color: darkgrey;
text-decoration: none;
padding-left: 10px;
padding-right: 10px;
}
a:link, a:visited { color: white; }
a:hover { color: cadetblue; background-color: white; }
a:active { color: darkgrey; }
/* HEADER */ /* HEADER */
.header { .header {
@ -29,24 +40,32 @@ body {
.header nav { .header nav {
background-color: cadetblue; background-color: cadetblue;
color: white;
} }
.header nav a { .header nav a {
color: white; background-color: cadetblue;
margin-inline: 10px; margin-inline: 10px;
} }
.header a:hover { color: darkgrey; }
.header a:active { color: cadetblue; }
/* MAIN CONTENT */ /* MAIN CONTENT */
.main-content { .main-content {
border-left: 6px solid cadetblue; border-left: 6px solid cadetblue;
border-right: 2px solid cadetblue;
margin-right: 20%;
} }
.main-content section { .main-content section {
margin-left: 10px; margin-left: 10px;
} }
.main-content .articles article {
margin-bottom: 50px;
}
.main-content h2,h3 { .main-content h2,h3 {
border-bottom: 6px solid cadetblue; border-bottom: 6px solid cadetblue;
border-left: 6px solid darkgrey; border-left: 6px solid darkgrey;
@ -58,19 +77,39 @@ body {
background-color: cadetblue; background-color: cadetblue;
} }
.main-content h4 {
border-bottom: 2px solid cadetblue;
padding-bottom: 4px;
}
.main-content .actus h4 {
margin-bottom: 0;
padding-bottom: 2px;
}
.main-content .actus p {
margin-top: 2px;
}
/* ASIDE */ /* ASIDE */
.links { .links {
background-color: #ebebebca; background-color: #ebebebca;
padding-left: 2%;
padding-right: 2%;
padding-top: 1%;
border: 6px solid cadetblue; border: 6px solid cadetblue;
display: block; display: block;
float: right;
position: fixed; position: fixed;
top: 400px; top: 113px;
right: 8px; right: 8px;
height: 400px; height: 400px;
} }
.links h3, ul {
text-align: justify;
}
/* FOOTER */ /* FOOTER */
footer { footer {

Write Preview
Loading…
Cancel
Save