From 54247e21606e230e2a2a4e7e3bf0f1f25d075257 Mon Sep 17 00:00:00 2001
From: Nezumi <loiphan2711@gmail.com>
Date: Tue, 20 Jun 2023 15:34:20 +0700
Subject: [PATCH] Init sample code training chapter 11

---
 Sample/training-11-sample/index.html | 109 +++++++++++++++++++++++++++
 1 file changed, 109 insertions(+)
 create mode 100644 Sample/training-11-sample/index.html
diff --git a/Sample/training-11-sample/index.html b/Sample/training-11-sample/index.html
new file mode 100644
index 0000000..3738eee
--- /dev/null
+++ b/Sample/training-11-sample/index.html
@@ -0,0 +1,109 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Color</title>
+    <style type="text/css">
+        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);
+        }
+    </style>
+</head>
+
+<body>
+    <h1>pH Scale</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 ACID</p>
+</body>
+
+</html>
\ No newline at end of file
