반응형웹 만들기

시작

본 강의는 반응형 홈페이지를 만들 때 사용되는 기법을 설명하기 위해 기존에 만들었던 http://uany06.anybuild.co.kr 에서 메인만 반응형 웹으로 만들어 보도록 하겠습니다.
사실 메인만 만들어 보면 다른 서브 페이지는 모두 작업 방법이 동일하기 때문에 메인만 만들어 봐도 충분할 것 같습니다.

사전작업

우선 반응형 홈페이지 만들기에 앞서 사전 작업이 조금 필요 합니다.
우리는 체험판 계정을 받아서 홈페이지를 만들었는데, 체험판은 1유저당 1계정만 발급 되고 있습니다.
솔루션 에서는 홈페이지 메인 페이지를 1장만 지원하기 때문에, 반응형 메인 페이지를 추가 페이지로 대체 하고자 합니다.
그러기 위해서는 CSS 충돌을 피하기위해 현재 적용되어 있는 CSS를 스킨으로 옮겨야 합니다.

과정은 다음과 같습니다.

  1. [디자인관리 > 고급 디자인 관리 > 전체 화면 구성]에서 전체 화면구성에서 입력한 소스를 잘라내기 합니다. (Ctrl+x)
  2. [디자인관리 > 고급 디자인 관리 > 스킨 관리]으로 가서 "메인스킨" , "서브스킨" 둘다 위에서 복사한 CSS 소스를 제일 위쪽에 붙여 넣습니다.


이렇게 수정 하시고 홈페이지 접속해서 보시면 변동 사항은 전혀 없을겁니다.
단지 모든 페이지에 적용되었던 default.css가 스킨으로 이동했기 때문에 결과물은 동일 합니다.

이렇게 해서 준비 작업은 마무리 되었습니다. ^^

다음 강좌에서 실제 반응형 웹 페이지를 만들어 보도록 하겠습니다.


top