커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
이미지 크기
undefined주차
북마크
유*건
댓글
3
추천
0
조회수
22
조회수
22
답변 완료

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

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


이미지가 꽉차게 하려면 어떻게 해야하나요?



스파르타 즉문즉답

화면 전체를 캡처해 주시면, 튜터님들이 빠르게 상황을 이해할 수 있어요.




작성한 코드 및 에러 메세지

오류 발생 시, 작성한 코드 전체와 에러 메시<!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">
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <title>나만의 동기부여 홈화면 만들기</title>


    <script src="index.js"></script>


    <style>
        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap');


        * {
            font-family: 'Poppins', sans-serif;
        }  
        
        body {
            background-image: url("https://images.pexels.com/photos/4603529/pexels-photo-4603529.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1");
            background-position: center;
            background-repeat: no-repeat;
            background-size: auto;


            color: white;


        }


        .time {
            font-size: 80px;
            font-weight: bold;
        }


        .greeting {
            font-size: 50px;
        }


        .todo {
            font-size: 30px
            ;
        }


        .author {
            font-size: 25px;
            font-style: italic;
        }


        .main {
            width: 100vw;
            height: 80vh;


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


        .quote {
            width: 100vw;
            height: 20vh;


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


    
    </style>


    <script>
    </script>
</head>


<body>
    <div class="main">
        <div id="time" class="time">12:00</div>
        <div class="greeting">Hello, geon!</div>
        <div class="todo">기분 좋게 해보자고</div>
    </div>
    <div class="quote">
        <div id="author" class="author">- 명언의 저자 -</div>
        <div id="content" class="content">" 명언의 내용 "</div>
    </div>
</body>


</html>지를 첨부해 주세요.

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

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




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