html

오른쪽에 instagram, fb, github, behance 아이콘을 추가했고, 로고와 앱 아이콘을 추가했다. 저 친구들은 스크롤 인디케이터 역할을 할 것이며 세로 정렬이 필요하다. 스크롤 중에는 저 중간 위치에 고정이 되어 있어야 한다. 200828_ienlab_microsite · ericanorhee/ienlab_microsite@aaa249e 메인 웹사이트 개발 시작 첫화면 github.com

대충 얕은 지식 가지고 웹사이트 개발을 시작했다. 모르는 건 그때그때 검색하면서 공부하면 될 것 같음 예전에 공부했던 게 조금씩 생각나기 시작했다. transition이 CSS3의 AtoZ인건 팩트 같은데.. 너무 부드럽다. 그리고 Font Awesome 이제 된다. all.css인가 그걸 import해야 되더라. 예전이랑 좀 바뀐 것 같다. 여튼 아이콘 import했고 다음에는 아이엔랩 로고 옆에 배치를 해야 한다. 200825_ienlab_microsite · ericanorhee/ienlab_microsite@f9274c3 메인 웹사이트 개발 시작 첫화면 github.com

이건 보고 그대로 했다. 10개 -> 8개 -> 9개가 되는데 nth-child로 숨기거나 보이거나 이렇게 했다. display:none 이건 앞의 내용을 바탕으로, 미리 보기? 샘플 사진만으로 그거 보고 미디어 쿼리와 CSS, HTML로 구현한 것이다. 보고 한 건 이거고, 생각보다 수월하게 작업할 수 있었다. 이건 헤더를 구현한 것인데, 이거 역시 너비를 조절하면 횡스크롤바가 생기는 것을 방지하고, 답답함을 줄이기 위해 빈칸을 넣게 되었다. https://github.com/ericanorhee/ienlab_microsite/commit/92881ee38a37966d15bf7d372a26e135d93892ce 200822_ienlab_microsite · ericanorhee/ienlab_micros..

이번에는 보지 않고 사진만 보고 구현하는 것을 목표로 하고 있다. 완성. 코드는 깃허브에! 재밌다. 언제까지나 미디어 쿼리만 잡고 있긴 그렇지만 차근차근! https://github.com/ericanorhee/ienlab_microsite/commit/9070c85c8955bb1d5bc6c973c48be0bf3182e973 200820_ienlab_microsite · ericanorhee/ienlab_microsite@9070c85 05 edu.goorm.io/learn/lecture/16942/웹퍼블리싱-실습-반응형-사이트-만들기/lesson/813675/05-반응형-레이아웃-유형-3 github.com