중간에 뭐가 잘못 클릭 된건지...다 완성한 것을 버튼속에 그림 바꿔넣다 화면이 안나와서 보니까...프로그램이 깨진것 처럼 길게 늘어져서 나옵니다..

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

중간에 뭐가 잘못 클릭 된건지...다 완성한 것을 버튼속에 그림 바꿔넣다 화면이 안나와서 보니까...프로그램이 깨진것 처럼 길게 늘어져서 나옵니다..

undefined주차

이*희

・

추천

・

조회수

답변 완료

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
            crossorigin="anonymous"></script>

    <title>스파르타코딩클럽 | 부트스트랩 연습하기</title>
    <link href="https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap" rel="stylesheet">
    <style>
        * {
            font-family: 'Gowun Dodum', sans-serif;
        }

          .mytitle{
            background-color: green;
            width: 100%;
            height: 250px;

            background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("https://movie-phinf.pstatic.net/20210715_95/1626338192428gTnJl_JPEG/movie_image.jpg");
            background-position: center;
            background-size: cover;

            color: white;

            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

        }

        .mytitle > button {
            width: 200px;
            height: 50;

            background-color: transparent;
            color: white;
            border-radius: 50px;
            border: 1px solid white;
            margin-top: 10px;
        }

        .mytitle > button:hover {
            border: 2px solid white;

        }

        . mycomment {
            color: gray;
        }

        .wrap {
            width: 1200px;
            margin: 20px auto 0px auto;
        }

        .mypost {
            background-color: green;
            width: 500px;
            margin: 10px auto 0px auto;

        }

        < body >
        < div class= "mytitle"
        >
        < h1 > 내 생애 최고의 영화들
    <

        /
        h1 >
        < button > 영화 기록하기💛<

        /
        button >
        <

        /
        div >
        < div class

        =
        "mypost
        ">
        간단한 글씨를 씁니다.

        <
        /
        div >
        < div class

        =
        "wrap"
        >
        < div class

        =
        "row row-cols-1 row-cols-md-4 g-4"
        >
        < div class

        =
        "col"
        >
        < div class

        =
        "card"
        >
        < img src

        =
        "https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"
        class

        =
        "card-img-top"
        alt

        =
        "..."
        >
        < div class

        =
        "card-body"
        >
        < h5 class

        =
        "card-title"
        > 여기에 제목이 들어갑니다.<

        /
        h5 >
        < p class

        =
        "card-text"
        > 여기에 내용이 들어가지요.<

        /
        p >
        < p > ⭐⭐⭐<

        /
        p >
        < p class

        =
        "mycomment"
        > 여기에 코멘트가 들어갑니다.<

        /
        p >
        <

        /
        div >
        <

        /
        div >
        <

        /
        div >
        < div class

        =
        "col"
        >
        < div class

        =
        "card"
        >
        < img src

        =
        "https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"
        class

        =
        "card-img-top"

댓글 알림