취미공작소

1. Top nav or “do nothing” approach 상단에 네비게이션을 위치시키는 쉬운 방법중의 하나로서, 이러한 이유로 아마도 가장 많이 사용이 되는 형식이 아닐까 한다. 장점 1) Easy to implement – 큰 화면 모습 거의 동일하게 쉽게 구현할 수 있다. 2) No Javascript dependencies 3) No back-breaking CSS maneuvers required – 힘든 CSS 작업이 필요 없다. 4) No tripping over your source order – 화면 flow가 자연스러우며, 메뉴를 찾느라 고생하지 않는다. 단점 1) Height issues – 모바일 웹에서 사용자에게 첫번째는 컨텐츠, 두번째가 네비게이션이다. 따라서 가능한 빨리 ..

1. Mostly Fluid 심플하기 때문에 가장 많이 사용되는 패턴으로, 큰 화면에서는 더 많이 여유를(가장자리)를 두고, 유연한 Grids와 큰화면에서 작은화면으로 이미지 스케일링, 화면이 작아질 수록 세로로 column들을 쌓는 형태를 취하는 패턴이다. Five Simple Steps Princess Elisabeth Antarctica. Trent Walton Sifter ChoiceResponse 2. Column Drop 또 다른 인기있는 패턴으로, multi-column layout으로 시작해서 single-column layout과 화면사이즈가 작아짐에 따라 column이 아래로 떨어지는 형태로 끝이난다. Mostly Fluid pattern과는 달리, 이 레이아웃에서는 요소들의 전체 사이..

Internet Exploer 6~8 버전 브라우저 문제 해결 다행스럽게도 Internet Exploer 6~8 버전 브라우저에서도 미디어쿼리를 해석할 수 있도록 만들어 주는 JavaScript 라이브러리가 있었다. respond.min.js라고 부르는 이 파일은 약 4KB 정도의 용량이다. 어떤 용도로 사용해도 제한이 없는 MIT 또는 BSD 라이선스를 가지고 있기 때문에 소스 코드에 포함된 라이선스 명시 조항만 지우지 않으면 github에서 언제든 내려받아 사용할 수 있다. respond.min.js 내려받기: https://github.com/scottjehl/Respond/downloads respond.min.js 파일을 HTML 문서의 태그 부분에 다음과 같은 방식으로 삽입하면 Internet..

http://colly.com/ http://www.anderssonwise.com http://stephencaver.com/ http://seesparkbox.com/ http://foodsense.is/ http://www.bostonglobe.com/ http://blog.teamtreehouse.com/ http://www.sasquatchfestival.com/ http://interim.it/ http://staffanstorp.se/ http://alistapart.com/d/responsive-web-design/ex/ex-site-FINAL.html http://forefathersgroup.com/ http://spigotdesign.com/ http://us.illyissimo.co..