반응형 레이아웃
-
반응형 웹 레이아웃 주의사항 _2html, css/반응형 웹 2017. 8. 19. 16:44
반응형 웹 레이아웃 주의사항 2번째 포스트입니다. 2. table 태그에서 rowspan, colspan을 css로 컨트롤 할 수 없습니다. 다음 이미지와 같이 모바일 화면과 PC 화면에서의 테이블 표를 다르게 하고 싶은 경우가 있을 것입니다. 모바일 화면에서는 제목 열이 4칸 인데 PC에서는 제목열이 3칸이고 , 또 PC 에서는 내용1열B와 2열B 가 합쳐져 있습니다. 저렇게 표현을 하려면 다음과 같은 html 로 수정이 되어야 합니다. [모바일 html] [PC html] PC 화면의 html 을 확인 하게 되면 안에 있는 두번째 태그 colsapn="2"를 추가 해주었고, 갯수를 하나 지워 주었습니다.그리고 안에 있는 첫번째 안에 있는 두번째 에 rowspan="2" 를 추가 해주었고, 두번째 안에..
-
반응형 웹 레이아웃 주의사항 _1html, css/반응형 웹 2017. 8. 17. 22:40
반응형 웹 레이아웃을 구상하기 전에 다음과 같은 부분들을 알고 구상을 하면 반응형 프로젝트를 좀 더 시간을 단축 할 수 있고 좀 더 효율적인 화면이 탄생 될 것이라 생각합니다. 반응형 웹이란 쉽게 이야기하면 하나의 html 요소들을 css(media query)를 이용하여 PC, 모바일, 태블릿 화면에 알맞는 레이아웃을 표현 해 주는 것입니다. 여기서 더 간단히 요점만 말하자면 기본 하나의 뼈대로 PC일때, 모바일 일때, 태블릿 일때 옷 만 바뀌는 것입니다.(긴팔에서 반팔, 무지 t셔츠가 스프라이트 t셔츠로..이런느낌 입니다.) 뼈 들이 움직이지는 못하고 뼈를 감싸고 있는 옷만 바뀌는 것이기 때문에 레이아웃을 표현 하는데 어느 부분은 제한적인 부분들이 있습니다. 제가 정리하고 싶은 부분은 이런 제한적인 ..