bootstrap practice 1

10 months ago · 175a90882f
parent c1625dc969
commit 175a90882f
1 changed files with 39 additions and 0 deletions
--- a/Practice/P1/default.html
+++ b/Practice/P1/default.html
@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width"/>
+
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+    
+    <title>P1</title>
+</head>
+<body>
+    <div class="containter m-5" style="height: 300px;">
+        <div class="row h-25 my-5 bg-primary align-items-center">
+            <p class="text-white text-center fs-3 fw-bold">
+                CSS Practice-1
+            </p>
+        </div>
+        <div class="row h-50 my-5 bg-danger align-items-center text-white text-left">
+            <p class="mx-5">
+                Department: Computer Engineering <br>
+                Student Name: Hong Kil Dong <br>
+                Student ID: 20240625
+            </p>
+        </div>
+        <div class="row h-75 my-5 bg-light align-items-center text-left">
+            <sapn class="mx-5">
+                <p class="fs-5 fw-bold">
+                    Example
+                </p>
+                <xmp class="bg-white w-75 text-left">
+                    <h1>Hello World</h1>
+                    <p>Loream ipsum...</p>
+                </xmp>
+                <button class="btn btn-success">Try it Yourself</button>
+            </sapn>
+        </div>
+    </div>
+</body>
+</html>