커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
날짜 영역이 흰색으로 안 바뀌는데 확인 부탁드립니다!
인생사진 쏙쏙 코딩네컷 v0
1주차
북마크
서*림
댓글
3
추천
0
조회수
11
조회수
11
답변 완료

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

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


날짜부분의 색상이 흰색으로 바뀌지 않는데, 제가 보기에는 다 맞게 작성한거 같은데 어떤 부분을 수정해야하는지 확인 부탁드립니다.



스파르타 즉문즉답




작성한 코드 및 에러 메세지

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

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

    <title>코딩네컷</title>

        <style>

      /* 이서윤체 폰트 적용을 위한 코드 */

      @font-face {

        font-family: "LeeSeoyun";

        src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2202-2@1.0/LeeSeoyun.woff")

          format("woff");

        font-weight: normal;

        font-style: normal;

      }

      /* body태그 자체에 css 요소 부여 */

body {

    font-family: "LeeSeoyun";

    margin: 0;

    display: flex;

    justify-content: center;

    background-image: url("./background.png");

}


.container {

    width: 390px;

    background-color: #ff9d73;

    height: 100%;

}


.photos {

    margin-top: 30px;

}


.photo-frame {

    background-color: white;

    margin: 15px 20px;

    height: 200px;

}


.footer {

    display: flex;

    flex-direction: column;

    align-items: center;

}


.f-title {

    color: white;

    font-size: 25px;

    font-weight: 900;

}


.f-date {

    font-size: 15px;

    font-weight: 500;

    color: white;

}

        </style>

  </head>

  <body>

        <div class="container">

            <div class="photos">

                <div id="image1" class="photo-frame">

                    <span id="desc1" class="photo_description">

                        첫번째 이미지 설명

                    </span>

                </div>

                <div id="image2" class="photo-frame">

                    <span id="desc2" class="photo_description">

                        두번째 이미지 설명

                    </span>

                </div>

                <div id="image3" class="photo-frame">

                    <span id="desc3" class="photo_description">

                        세번째 이미지 설명

                    </span>

                </div>

                <div id="image4" class="photo-frame">

                    <span id="desc4" class="photo_description">

                        네번째 이미지 설명

                    </span>

                </div>

            </div>

            <div class="footer">

                <p class="f-title">Happy Lunch Time</p>

                <p calss="f-date">2023.03.31</p>

            </div>

        </div>

  </body>

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

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

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




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