김코드의 웹디자인 세상

안녕하세요! 오늘은 scss에서의 미디어쿼리 잡는 가이드를 가지고 왔습니다. css3로 작업을 하다 보면 불편한 사항들이 몇 가지 생겨서 작업에 조금 애를 먹은 적이 있었는데 이번에 scss를 시작하면서 조금은 개선된 사항으로 작업을 하니 효율적인 방법 할 수 있었습니다. //media width $mobile: 320px; $mobile2: 900px; $desktop: 901px; $desktop1: 1400px; @mixin mobile{ @media (min-width: $mobile) and (max-width: $mobile2){ @content; } } @mixin desktop{ @media (min-width: $desktop) and (max-width: $desktop1){ @cont..

이번에 포트폴리오를 준비하면서 반응형으로 기획하고 구현을 하는데 진짜 이 min-width와 max-width 때문에 머리가 터지는 줄 알았다ㅠ ( ´△｀) 학원을 다니면서 배운게 아니라 독학을 하면서 배워서 그런 건가 싶기도 했지만 포기하지 않고 열심히 책과 구글링을 하고 조언을 들으면서 드디어 이해를 하고 구현을 했다... (뿌듯했다...!) 역시 모든지 노력하면 안되는 건 없다는 말이 정답인 것 같다. 다만 얼마나 노력을 하고 시간을 쏟는지가 결단인 듯. 여하튼 min-width와 max-width를 구현하면서 꼭 기억해야 하는 유의점이다! ✎ min-width 모바일부터 구현을 하는 경우엔 min-width를 사용하여 오름차순으로 작성하면 된다!! /*min-width로 작성을 하기 떄문에 오름차..