début tp2

2 years ago · 0f9164529a
parent 65a375f010
commit 0f9164529a
2 changed files with 40 additions and 12 deletions
--- a/index.html
+++ b/index.html
@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <html>
  <head>
-    <meta charset="utf-8" \>
+    <meta charset="utf-8" />
    <title>Languages de programmation</title>
+    <link href="styles.css" rel="stylesheet" />
  </head>
  <body>
    <h1>Languages de programmation</h1>
-    <img src="img/ProgrammingLanguage1-1.jpg" alt="Images des nom de programmes"
-      width="400" height="250" />
-    <div>
+    <img class="imghead" src="img/ProgrammingLanguage1-1.jpg" alt="Images des nom de programmes" />
+    <div class"main">
      <article>
        <h2>actualités des languages</h2>
        <section>
@ -34,21 +34,27 @@
        </section>
      </article>
    </div>
+      <aside class="links">
+        <h3>Quelques liens externes..</h3>
+        <ul>
+          <li><a href="https://fr.wikipedia.org/wiki/C_(langage)">C (Wiki)</a></li>
+          <li><a href="https://fr.wikipedia.org/wiki/C%2B%2B">C++ (Wiki)</a></li>
+          <li><a href="https://fr.wikipedia.org/wiki/C_sharp">C# (Wiki)</a></li>
+        </ul>
+      </aside>
    <div>
      <article>
        <h2>Actualités du site</h2>
        <section>
          <h3>Initialisation du site</h3>
-          <p>08/09/2022: Initialisation du site.</p>
+          <p>08/09/2022: Création de la page d'acceuil, des 3 premiers articles,
+          et de la table.</p>
+        </section>
+        <section>
+          <h3>Ajouts des stylesheets</h3>
+          <p>15/09/2022: Ajouts de styles.css.</p>
        </section>
      </article>
-      <aside>
-        <ul>
-          <li><a href="https://fr.wikipedia.org/wiki/C_(langage)">C (Wiki)</a></li>
-          <li><a href="https://fr.wikipedia.org/wiki/C%2B%2B">C++ (Wiki)</a></li>
-          <li><a href="https://fr.wikipedia.org/wiki/C_sharp">C# (Wiki)</a></li>
-        </ul>
-      </aside>
    </div>
    <div>

--- a/styles.css
+++ b/styles.css
@ -0,0 +1,22 @@
+body {
+  background-color: #ebebeb;
+  margin-width: 80%;
+}
+
+h1 {
+  background-color: #c9832e;
+  color: white;
+}
+
+
+.imghead {
+  float: right;
+  width: 400px;
+  height: 250px;
+}
+
+.links {
+  height: 400px;
+  float: right;
+  border-width: 20%;
+}