커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
부트스트랩 적용이 안되요
[왕초보] 코딩이 처음이어도 쉽게 배우는 웹개발 A to Z v0
2주차
북마크
정*진
댓글
7
추천
0
조회수
27
조회수
27
답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.


<button type="button" class="btn btn-outline-light">영화기록하기</button>

 <header class="p-3 mb-3 border-bottom">

    <div class="container">

      <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">

        <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 link-body-emphasis text-decoration-none">

          <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap">

            <use xlink:href="#bootstrap"></use>

          </svg>

        </a>


        <ul class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0">

          <li><a href="#" class="nav-link px-2 link-secondary">Overview</a></li>

          <li><a href="#" class="nav-link px-2 link-body-emphasis">Inventory</a></li>

          <li><a href="#" class="nav-link px-2 link-body-emphasis">Customers</a></li>

          <li><a href="#" class="nav-link px-2 link-body-emphasis">Products</a></li>

        </ul>


        <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">

          <input type="search" class="form-control" placeholder="Search..." aria-label="Search">

        </form>


        <div class="dropdown text-end">

          <a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle"

            data-bs-toggle="dropdown" aria-expanded="false">

            <img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">

          </a>

          <ul class="dropdown-menu text-small">

            <li><a class="dropdown-item" href="#">New project...</a></li>

            <li><a class="dropdown-item" href="#">Settings</a></li>

            <li><a class="dropdown-item" href="#">Profile</a></li>

            <li>

              <hr class="dropdown-divider">

            </li>

            <li><a class="dropdown-item" href="#">Sign out</a></li>

          </ul>

        </div>

      </div>

    </div>

  </header>

적용이 안되요




<!DOCTYPE html>

<html lang="en">


<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <style>

        @import url('https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap');


        * {

            font-family: 'Gowun Dodum', sans-serif;

        }


        .main {

            background-color: green;

            color: white;

            background-image: url('https://occ-0-1123-1217.1.nflxso.net/dnm/api/v6/6AYY37jfdO6hpXcMjf9Yu5cnmO0/AAAABeIfo7VL_VDyKnljV66IkR-4XLb6xpZqhpLSo3JUtbivnEW4s60PD27muH1mdaANM_8rGpgbm6L2oDgA_iELHZLZ2IQjG5lvp5d2.jpg?r=e6e.jpg');

            background-position: center;

            background-size: cover;

        }


        body {

            background-color: black;

        }

    </style>

</head>


<body>

    <header class="p-3 mb-3 border-bottom">

        <div class="container">

            <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">

                <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 link-body-emphasis text-decoration-none">

                    <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap">

                        <use xlink:href="#bootstrap"></use>

                    </svg>

                </a>


                <ul class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0">

                    <li><a href="#" class="nav-link px-2 link-secondary">Overview</a></li>

                    <li><a href="#" class="nav-link px-2 link-body-emphasis">Inventory</a></li>

                    <li><a href="#" class="nav-link px-2 link-body-emphasis">Customers</a></li>

                    <li><a href="#" class="nav-link px-2 link-body-emphasis">Products</a></li>

                </ul>


                <form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">

                    <input type="search" class="form-control" placeholder="Search..." aria-label="Search">

                </form>


                <div class="dropdown text-end">

                    <a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle"

                        data-bs-toggle="dropdown" aria-expanded="false">

                        <img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">

                    </a>

                    <ul class="dropdown-menu text-small">

                        <li><a class="dropdown-item" href="#">New project...</a></li>

                        <li><a class="dropdown-item" href="#">Settings</a></li>

                        <li><a class="dropdown-item" href="#">Profile</a></li>

                        <li>

                            <hr class="dropdown-divider">

                        </li>

                        <li><a class="dropdown-item" href="#">Sign out</a></li>

                    </ul>

                </div>

            </div>

        </div>

    </header>

    <div class="main">

        <div class="p-5 mb-4 bg-body-tertiary rounded-3">

            <div class="container-fluid py-5">

                <h1 class="display-5 fw-bold">킹덤설명</h1>

                <p class="col-md-8 fs-4">병든 왕을 둘러싸고 흉흉한 소문이 떠돈다. 어둠에 뒤덮인 조선, 기이한 영병에 신음하는 산하, 정체 모를 악에 맞서 백성을 구원할 희망은

                    오직 세자뿐이다.</p>

                <button type="button" class="btn btn-outline-light">영화기록하기</button>

                <button type="button" class="btn btn-outline-light">상세정보</button>

            </div>

        </div>

    </div>


</body>


</html>



취소
 공유
취소
댓글 0
댓글 알림
나의얼굴