웹프로그래밍2 02 . NAVER clone , 동적효과를 위한 js 추가 추가 기능 1. 급상승 검색어 및 연합뉴스 컨텐츠 슬라이드 효과 2. 검색창 위에 마우스 오버시 나오는 급상승 검색어 리스트 급상승 검색어 1 필영 2 네이버 3 클론 4 페이지 5 입니다 6 using 7 HTML 8 CSS 9 JS 10 WEB .navbar-rank{ display:flex; width:200px; height:17px; padding-left: 145px; justify-content: flex-end; position: relative; overflow: hidden; } .rank{ position: absolute; top:0px; left:135px; display: flex; flex-direction: column; width:60%; justify-content: sp.. 2019. 11. 14. 191106 / Today I Learned HTML , CSS , JS 공부할겸 여러 템플릿을 클론하여 스스로 제작해보기로 함. 이번에 클론 해 볼 것은 한국의 대표적인 포털사이트 NAVER 메인페이지 템플릿. 이미지 부분들은 sprite 이미지를 사용하여 구현하였다. http://www.spritecow.com/페이지를 통해 쉽게 sprite이미지를 활용하여 구현 가능하다. flexbox를 이용하여 대략적인 레이아웃을 구성하였다. 정말 쉽게 레이아웃을 잡을 수 있는 방법이다. CSS를 공부하시는 분이라면 꼭 한번 공부하면 좋을 것이다. 191106 / 23시 내용 추가) display grid 속성을 이용하여 컨테이너 컨텐츠 내용을 구성해보려 했으나 , grid 사용도 미숙하고 박스크기가 일정치 않아 구현하는데 고민이 되서 일단은 positio.. 2019. 11. 6. 이전 1 다음
