감성 퍼블리셔 html,css

* HTML 도움 사이트 http://naradesign.net/wp/ ( 정찬명님 블로그 ) http://helloworld.naver.com/helloworld ( NHN 개발자 블로그 ) http://dev.naver.com/ ( 네이버 개발사 센터 ) http://html.nhncorp.com/ ( 네이버 널리 ) http://ui.daum.net/ ( 다음 웹표준 다룸 ) http://troy.labs.daum.net/ ( 디바이스별 확인 가능 사이트 ) http://opentutorials.org/course/1 ( 생활코딩 ) http://entitycode.com/#featured-content ( 특수문자 ) * 미디어 쿼리 사이트 http://bradfrost.github.io/this..

씨네큐브 반응형웹 사이트 보기 우연히 사이트 메인시안을 참조하기 위해 벤치마킹을 하는 도중에 들어오게 된 사이트입니다. 요즘은 웹사이트에 들어가면 습관처럼 브라우저창 가로를 줄여보네요, 아무래도 반응형웹이 그만큼 대중화가 되어 사용이 되고 있다는 뜻이지요. | 이것은 씨네큐브의 메인페이지 입니다. 기본적으로 GNB는 좌측에 위치하고 있으며 우측에는 관련 컨텐츠가 뿌려지는 형태입니다. 조금 브라우저 창을 축소해보았습니다. | 네, 보시는것처럼 GNB가 상단으로 올라갔네요. 메인 제이쿼리는 이와같이 비율유지하며 축소가 되고 하단부분에 좀더 큰 프레임으로 메인제이쿼리가 반복적으로 구현되는것을 확인하실 수 있습니다. | 이것은 대략 모바일 크기에 맞게 줄였을떄 구현되는 페이지 모습입니다. GNB부분을 전체보기를..

반응형 관련 홍익대학교 졸업전시회 사이트 | 브라우저 창크기와 관련하여 유연하게 변형이 되는 반응형 웹사이트에 대해서 적어보았다. |홍익대학교는 매년 이러한 졸작을 웹사이트를 구현하여 전시를 하는것 같다. 웹 카다로그 개념으로, 졸작에 작품과 관련 컨텐츠를 웹으로 구현하였다. 지난 2008년, 2011년, 그리고 내가 지금 포스팅을 하려는 2012년 일자이다. | 처음 메인페이지에 들어가면 일단 시각적인 효과가 눈앞에 펼쳐진다. 우측에 작은 썸네일들이 일정한 효과를 주며 구현이 된다. | 브라우저 창 크기를 가로폭을 좁히게 되면 우측 썸네일들이 비율이 일정하게 축소되며 밀리게 되는 현상을 볼 수 있다. 전체적으로 %를 활용하여 크기에 민감하게 반응하도록 한 것 같다. | 썸네일을 오버했을시 관련 컨텐츠가..