Moved CSS styling from inline to external file.

danielaboost · Jul 8, 2021 · 58d97ad · 58d97ad
1 parent 88e8926
commit 58d97ad
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/index.html b/index.html
@@ -1,34 +1,35 @@
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="stylesheets/index.css">
     <title>Test Page: Don't Panic</title>
     <meta charset="utf-8">
   </head>
   <body>
     <h1>I'm an h1</h1>
     <ul>
       <li>
-        <a href="https://example.com/" style="color: red;">Link</a>
+        <a href="https://example.com/">Link</a>
       </li>
       <li>
-        <a href="https://example.com/" style="color: red;">Link</a>
+        <a href="https://example.com/">Link</a>
       </li>
       <li>
-        <a href="https://example.com/" style="color: red;">Link</a>
+        <a href="https://example.com/">Link</a>
       </li>
     </ul>
     <h2>I'm an h2</h2>
-    <div style="border: 1px solid black;">
-      <a href="https://example.com/" style="color: green;">I'm a link</a>
+    <div>
+      <a href="https://example.com/">I'm a link</a>
     </div>
-    <div style="border: 1px solid black;">
-      <a href="https://example.com/" style="color: green;">I'm a link</a>
+    <div>
+      <a href="https://example.com/">I'm a link</a>
     </div>
-    <div style="border: 1px solid black;">
-      <a href="https://example.com/" style="color: green;">I'm a link</a>
+    <div>
+      <a href="https://example.com/">I'm a link</a>
     </div>
-    <div style="border: 1px solid black;">
-      <a href="https://example.com/" style="color: green;">I'm a link</a>
+    <div>
+      <a href="https://example.com/">I'm a link</a>
     </div>
   </body>
 </html>
diff --git a/stylesheets/index.css b/stylesheets/index.css
@@ -0,0 +1,11 @@
+a {
+  color: red;
+}
+
+div {
+  border: 1px solid #000;
+}
+
+div a {
+  color: green;
+}