이미지가 다르게 나옵니다 | 스파르타 커뮤니티

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

이미지가 다르게 나옵니다

undefined주차

김*근

・

추천

・

조회수

답변 완료

html로 연 사이트에는 이미지가 제대로 적용이 되어 있지만

github으로 연 사이트에는 이미지가 적용이 안되어 있습니다

나머지는 정상입니다

github으로 연 사이트

파일 속 html로 연 사이트

작성한 코드 및 에러 메세지

<!DOCTYPE html>
<html>
    <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 property="og:title" content="김대근 - 프로필 링크" />
        <meta property="og:description" content="환영합니다" />
        <meta property="og:image" content="image.jpg" />
        <title>김대근 - 프로필 링크</title>
        <style>
            @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
        * {
            font-family: "Pretendard",serif;
            }
            body {
                background-color: #44398a;
            }
            .profile{
                width: 100px;
                height: 100px;
                background-color: green;
                border-radius: 100%;
                border: 2px solid white;
                background-image: url('image.jpg');
                background-position: center;
                background-size: cover;
                }
                .main{
                    color: white;
                    font-size: 24px;
                    margin-top: 30px;
                    margin-bottom: 10px;
                    }
                .sub{
                    color: white;
                    font-size: 15px;
                    margin-top:  0px;
                    margin-bottom: 30px;
                }
                .wrap{
                    width: 300px;
                    margin: 30px auto 0px auto;

                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                }
                .wrap > a {
                    width: 300px;
                    height: 50px;
                    background-color: white;
                    border-radius: 8px;
                    margin-bottom: 10px;
                    font-size: 14px;
                    font-weight: bold;
                    color: #44398a;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    text-decoration: none;
                    box-shadow: 3px 3px 5px 0px black;
                    
                }
                .wrap > a:hover{
                    background-color: #f2f2f2;
                }
        </style>
    </head>
    <body>
        <div class="wrap">
            <div class="profile"></div>
            <h1 class="main">김대근</h1>
            <p class="sub">환영합니다</p>
            <a target="_blank" href="https://www.instagram.com/daegeun_k_/">인스타그램 (Instagram)</a>
            <a target="_blank" href="https://blog.naver.com/bgoolz3513">네이버 블로그 (Naver Blog)</a>
            <a target="_blank" href="https://www.youtube.com/channel/UCItx_dGfuPBhmPR8OR8Uh2g">유튜브 (YouTube)</a>

        </div>
    </body>
</html>

댓글 알림