웹 썸네일형 리스트형 반응형 웹 (Responsive Web) - test3 test2에서 생각했던것 보다 잘 안되서 다시 생각 좀 해보았다. test2보다는 좀더 간단하게 구조를 해보았다. 기본 CSS를 설정 512px 사이즈일때 CSS를 변경해서 넣어준다. 반응형 웹은 모바일 기기를 위해 제작하는 경우가 많은데 transform:translate3d를 이용하면 좀더 기기에 부담을 덜 줄 수 있고 약간이나마 좀 더 부드러운 움직임을 구현할 수 있다. translate3d는 좀 어려운 부분이라 따로 연구좀 해봐야 되는 부분이다. 나중에 기회가 되면 따로 다뤄봐야 겠다. 자바스크립트를 넣어주는데 ham클릭시 menu-wrap에 addClass로 menu-on 클라스를 추가해준다. ham-wrap은 메뉴가 나왔을시 그 외에 부분은 어둠게 처리해서 메뉴에 집중시켜주는 효과를 넣어준다... 더보기 CSS 반응형 웹 (Responsive Web) - test1 저번 면접때 주로 질문 받은건 반응형 웹이 가능하냐에 대한 질문을 많이 받았다. 내가 리뉴얼한 페이지는 반응형이 아니라 자신있게 할 수 있다고 말을 못했다. 준비되지 않은것에 자신있게 거짓말하기가 싫었다. 그리고 해본거랑 할 주 아는거는 차이가 크기 때문이다. 그래서 조금씩 해보기로했다. 처음에는 간단하게 시작하도록 하자. 미디어 쿼리 적용법은 4가지가 있다. 1.link 태그 안에 위치하여 media 속성 안 조건에 만족할 때 해당 css파일을 불러온다 2. 태그 안에 위치하여 media 속성 안 조건에 만족 할 때 스타일을 적용 시킨다 3. - @import 태그 안에서 @import를 사용하여 뒷 부분의 미디어 쿼리를 만족 할 때 해당 css파일을 불러온다. 4.CSS파일 불러온 css파일 안 혹은.. 더보기 이전 1 다음
