Added css and updated html

mark-e-kibbe · Jun 3, 2019 · c1a8396 · c1a8396
1 parent e5328c1
commit c1a8396
Show file tree

Hide file tree

Showing 3 changed files with 108 additions and 5 deletions.
diff --git a/CSS/color.css b/CSS/color.css
@@ -0,0 +1,78 @@
+body {
+    background-color: silver;
+    color: white;
+    padding: 20px;
+    font-family: Arial, Verdana, sans-serif;
+}
+
+h1 {
+    background-color: #ffffff;
+    background-color: hsla(0, 100%, 100%, 0.5);
+    color: #64645A;
+    padding: inherit;
+}
+
+p {
+    padding: 5px;
+    margin: 0px;
+}
+
+p.zero {
+    background-color: rgb(238, 62, 128);
+}
+
+p.one {
+    background-color: rgb(244, 90, 139);
+}
+
+p.two {
+    background-color: rgb(243, 106, 152);
+}
+
+p.three {
+    background-color: rgb(244, 123, 166);
+}
+
+p.four {
+    background-color: rgb(245, 140, 178);
+}
+
+p.five {
+    background-color: rgb(246, 159, 192);
+}
+
+p.six {
+    background-color: rgb(245, 176, 204);
+}
+
+p.seven {
+    background-color: rgb(0, 187, 136);
+}
+
+p.eight {
+    background-color: rgb(140, 202, 242);
+}
+
+p.nine {
+    background-color: rgb(114, 193, 240);
+}
+
+p.ten {
+    background-color: rgb(84, 182, 237);
+}
+
+p.eleven {
+    background-color: rgb(48, 170, 233);
+}
+
+p.twelve {
+    background-color: rgb(0, 160, 230);
+}
+
+p.thirteen {
+    background-color: rgb(0, 149, 226);
+}
+
+p.fourteen {
+    background-color: rgb(0, 136, 221);
+}
diff --git a/Color/Color.html b/Color/Color.html
@@ -1,9 +1,29 @@
 <!DOCTYPE html>
 <html>
+
     <head>
-
+        <title>Chapter 11: Colors</title>
+
+        <link rel="stylesheet" type="text/css" href="../CSS/color.css">
     </head>
+
     <body>
-
+        <h1>ph Scale of Colors</h1>
+        <p class="fourteen">14.0 Very Alkaline</p>
+        <p class="thirteen">13.0</p>
+        <p class="twelve">12.0</p>
+        <p class="eleven">11.0</p>
+        <p class="ten">10.0</p>
+        <p class="nine">9.0</p>
+        <p class="eight">8.0</p>
+        <p class="seven">7.0 Neutral</p>
+        <p class="six">6.0</p>
+        <p class="five">5.0</p>
+        <p class="four">4.0</p>
+        <p class="three">3.0</p>
+        <p class="two">2.0</p>
+        <p class="one">1.0</p>
+        <p class="zero">0.0 Very Acidic</p>
     </body>
-</html>
+
+</html>
diff --git a/index.html b/index.html
@@ -1,9 +1,14 @@
 <!DOCTYPE html>
 <html>
     <head>
-
+        <title>CSS Examples And Reference</title>
     </head>
     <body>
-
+        <h1>Duckett HTML and CSS Book</h1>
+        <h2>Chapters and Contents</h2>
+        <ul>
+            <li><a href="/Color/color.html">Chapter 11: Colors</a></li>
+
+        </ul>
     </body>
 </html>