Project 4

[Git hub]깃허브로 웹페이지 만들기(4) - Modal 팝업창

하단에 아이콘을 하나 더 달았다. 맨 왼쪽 아이콘을 누르면 팝업창이 뜨도록 modal을 만들고 싶었다. new93helloworld.tistory.com/135 [Web] modal pop-up 만들기 modal pop-up 만들기 버튼이나 사진을 클릭 했을때 튀어나오는 나오는 화면을 modal pop-up 이라고 한다. 쉽게 말해서, 인스타그램이나 페이스 북에서 사진을 클릭 했을 때, 화면 전환 없이 해당 페이 new93helloworld.tistory.com 위 사이트를 참고하긴 했는데 그냥 내가 만들고 싶은 기능을 가진 템플릿에서 따오니까 더 쉬웠다. 사실 뭐가 뭔지 모르겠고 하나씩 읽어가면서 하는데 눈 빠지고 머리 터지는줄 알았다...ㅜㅜ 일단 결과는 나옴. 아이콘을 누르면 아래처럼 팝업창이 뜬다..

[Git hub]깃허브로 웹페이지 만들기(3) - 메인보드 추가

hadan-hwh.github.io/ HADAN | Portfolio 서강대학교 사회과학부 학생회 부학생회장- 2018~2019 서강대학교 사회과학부 새내기맞이사업 교양 교육 및 성평등주체- 2019 서강대학교 미술동아리 강미반 - 2019 사회과학부 댄스동아리 Craze - 2018 hadan-hwh.github.io 1. 배경이 밋밋해서 배경은 가만히 있지만 스크롤로 할 수 있는 메인보드를 앞에 추가했다. 기존의 레이아웃은 지웠다. inner를 만드는 코드 1 2 3 4 5 6 7 8 9 10 #main > .inner { width: 80rem; max-width: 90%; background: rgba(255,255,255,0.95); -webkit-box-shadow: 0 0 15px 0 rgb..

[Git hub]깃허브로 웹페이지 만들기(2) - 오픈소스로 디자인하기

처음부터 창조하기보다는 역시 남의 것을 습득하는 게 간편하고 빠르다. Github에서 포트폴리오 템플릿을 다운 받아서 내가 필요한 것만 가져오면 된다. 여기 양식이 다양하고 애니메이션도 있어서 가져올 것들이 많아서 참고 많이 했다. github.com/webstoryboy/portfolio webstoryboy/portfolio 포트폴리오 샘플 소스입니다. Contribute to webstoryboy/portfolio development by creating an account on GitHub. github.com 일단 [assets] 폴더에 [css], [font], [img] 폴더를 각각 만들어준다. 내가 참고할 템플릿에서 요소를 빼서 수정하는데 html은 내가 쓸 부분만 옮긴다. 나는 html..

[Git hub]깃허브로 웹페이지 만들기(1) - 웹페이지 생성

깃허브(Git hub)를 통해서 포트폴리오를 만들려고 했는데 내가 원하는 대로 커스터마이징하지 못하는 것이 아쉬웠다. 내가 원하는 것은 블로그가 아니라 resume를 한 페이지에 볼 수 있는 정도만 원하기도 하고. 모양은 안나오더라도 원하는대로 주물주물 하고 싶었다. Clone을 통해서 쉽게 만들려면 아래 사이트처럼 하는 것이 안깨지고 좋은듯. miryang.dev/2019/03/20/make-githubpages/ 간단하게 깃허브블로그(Github Pages) 생성하기 - MIRYANG.DEV GitHub.io 깃허브블로그로 부르는 Github Pages는 특히 개발자들이 포트폴리오용으로 많이 사용합니다. 저도 Tistory(티스토리)와 깃허브블로그 중 고민을 많이 했으나, 커스터마이징하기 쉽고 디자인..