나만의 웹 앨범 아트워크 만들기 (모듈)

HTML, CSS 사용하여 세부구성 만들기 (작업범위 100% 완성)

선행영상

 

글자를 제외한 기본 레이아웃 짜기 - 뒷배경

퀘스트 입니다 (부두공이 스프린트 완료에 반영)
hint) bootstrap grid, postion: absolute, img

다음 코드를 사용하여 '글자를 제외한' 기본레이아웃을 완성하세요

(업로드 형식 (닉네임)/Day3/index-layout.html)

 

 

폰트 세팅

hint) @font-face, font-familly

주어진 폰트 파일을 이용하여, 폰트를 css에서 전체 폰트를 바꾸세요.

파일

 

완성하기

퀘스트 입니다 (부두공이 스프린트 완료에 반영)
hint) h1, h2, h3, p, span

글자와, 다른 요소들을 추가하여 완성하세요. 자신이 작성한 이미지와 완벽히 일치해야합니다 (폰트, 스타일, 레이아웃, 색 코드 등등)

(업로드 형식 (닉네임)/Day3/index-complete.html)

 

모바일

퀘스트 입니다 (부두공이 스프린트 완료에 반영)
hint) DevTools for Mobile, Media Query CSS

현재 DevTools를 통해 본 모바일뷰는 엉망입니다. 이를 개선하세요

(업로드 형식 (닉네임)/Day3/index.html)

 

 

 

댓글

댓글 본문