BS로 레이아웃 잡기

10 months ago · c1625dc969
parent d1b50e0aba
commit c1625dc969
2 changed files with 33 additions and 0 deletions
--- a/outline/Ex1/default.html
+++ b/outline/Ex1/default.html
--- a/outline/Ex2/default.html
+++ b/outline/Ex2/default.html
@ -0,0 +1,33 @@
+<!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>Document</title>
+</head>
+<body>
+    <div class="container mt-5" style="height:500px">
+        <div class="row h-25 bg-warning">
+            <div class="col text-center my-auto">
+                Banner Area
+            </div>
+        </div>
+        <div class="row h-50">
+            <div class="col-8 bg-info">
+                Main Contents
+            </div>
+            <div class="col-4 bg-primary">
+                Side Menu
+            </div>
+        </div>
+        <div class="row h-25 bg-success">
+            <div class="col text-center my-auto">
+                Fotter Area
+            </div>
+        </div>
+    </div>
+</body>
+</html>