Merge pull request #13 from phuocduong-agilityio/training/chapter-11

Init sample code training chapter 11
2026-09-22 20:01:33 +00:00 · 2023-06-20 17:42:23 +07:00
parent be43ff2615 54247e2160
commit d53556ffb9
1 changed files with 109 additions and 0 deletions
@@ -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>