반응형 웹 with Media Queries Part3(학습 52일차 TIL)

김영진·2021년 8월 26일
0

210826 오늘은 리마인드 학습겸 float과 position을 사용해 레이아웃을 잡고, media query로 PC, Tablet, Mobile에서 볼 수 있는 반응형 웹사이트를 제작하는 연습을 했다.
float은 정말 불편하고 비효율적이라는 것을 새삼 느끼는 시간이었다.

Must Remember

  • float을 해제하기 위해서는 일종의 눈속임 방법으로 자식요소와 부모요소가 고정된 높이 값일 때 부모 요소에 height를 부여함으로 해결할 수 있다. 또한 부모요소가 float이 되어 있을 때, 자식 요소가 float 이 부여된다 해도 따로 해제하지 않아도 된다. 그러나 자식 요소의 float을 해결하기 위해 부모요소에 의미 없는 float의 부여는 좋지 않다.
    가장 좋은 방법은 가상요소 ':after'를 활용해서 자식 요소의 맨 마지막에 오도록 위치시키고, clear 속성을 주는 것이다.
  • header와 footer를 제이쿼리로 include 시킬 때, 서브페이지들의 폴더위치를 잘 확인하자.
profile
UI개발자 in Hivelab

0개의 댓글