1-10 본격 부트랩 써보기 강의 관련 질문 남깁니다.

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

1-10 본격 부트랩 써보기 강의 관련 질문 남깁니다.

undefined주차

・

추천

・

조회수

답변 완료

질문

카드를 세 장에서 네 장을 만들어야 하는 상황입니다.

강사님은 <div class= "row row-cols-1 row-cols-md-4 g-4'"> md-3을 4로 바꾸면 카드는 네 장으로 완성이 된다고 하셨는데 제가 찾아봤을 때 부트스트랩 카드는 3개 밖에 없었고 첨부된 코드 보시면 알겠지만 위와 같이 작성된 코드가 없어서

어떻게 4장으로 만들어야 할지 모르겠습니다. 어떻게 하면 카드를 4장으로 만들 수 있을까요..?

작성한 코드 및 에러 메세지

<body>
    <div class="mytitle">
        <h1>내 생애 최고의 영화들</h1>
        <button>영화 기록하기</button>
    </div>
        <div class="card-group">
            <div class="card">
                <img class="card-img-top" src="..." alt="Card image cap">
                <div class="card-body">
                    <h5 class="card-title">Card title</h5>
                    <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional
                        content. This content is a little bit longer.</p>
                    <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                </div>
            </div>
            <div class="card">
                <img class="card-img-top" src="..." alt="Card image cap">
                <div class="card-body">
                    <h5 class="card-title">Card title</h5>
                    <p class="card-text">This card has supporting text below as a natural lead-in to additional content.</p>
                    <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                </div>
            </div>
            <div class="card">
                <img class="card-img-top" src="..." alt="Card image cap">
                <div class="card-body">
                    <h5 class="card-title">Card title</h5>
                    <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional
                        content. This card has even longer content than the first to show that equal height action.</p>
                    <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
                </div>
          </div>
</div>

오류 발생 시, 작성한 코드 전체와 에러 메시지를 첨부해 주세요.

Tip 1) </> 아이콘을 눌러 코드박스를 만들어 보세요.

Tip 2) Ctrl+A(맥의 경우 Command+A) 단축키로 코드를 한 번에 선택할 수 있어요!

댓글 알림