728x90 반응형 프론트엔드/반응형웹2 CSS 미디어 쿼리(Media Query) CSS 미디어 쿼리(Media Query) 오늘은 저번 시간에 다뤘던 반응형 웹, 적응형 웹 중 현재 가장 많이 사용되는 반응형 웹 디자인에서 기초적으로 사용되는 미디어 쿼리(Media Query)를 알아보겠습니다. 반응형 웹을 간단하게 정리하면 웹 사용자들이 사용하는 디바이스에 따라 보기 편하게 변화하는 웹 디자인입니다. 그래서 반응형 웹을 사용하는 대표적인 홈페이지로 애플을 예로 들었습니다. 만약 안 들어가 보셨다면 꼭 가서 반응형 웹에 대해 경험해보셨으면 좋겠습니다. 미디어 쿼리는(Media Query) CSS에서 사용하는데 화면의 크기에 따라 텍스트의 크기나 이미지의 크기, 버튼의 생성 여부 등의 변화를 부여하여 반응형 웹을 만들 수 있습니다. 작성 예시를 보여드리면 '@media (조건){선택자.. 2022. 7. 20. CSS 반응형 웹, 적응형 웹 CSS 반응형 웹디자인 기초 오늘은 CSS에서 미디어 쿼리를 사용하여 반응형 웹에 대해 간단하게 설명드리겠습니다. 먼저 반응형 웹이란 웹페이지를 이용하는 각기 다른 사용자들이 스마트폰, 테블릿 pc, pc 모니터 등등의 기기를 통해 볼 수 있기 때문에 사용자마다 사용하는 기기의 화면의 크기에 맞게 변형되는 것을 반응형 웹이라고 합니다. 반응형 웹의 반대는 적응형 웹이라고 하는데 적응형 웹은 기기에 따라 변화하지 않고 특정한 화면이 유지되는 웹을 의미합니다. 대표적으로 애플의 홈페이지를 반응형, 네이버의 홈페이지를 적응형이라고 할 수 있습니다. 두 방식의 장단점을 보시면 반응형 웹의 장점은 수정하려고 할 때 한 파일에서만 작업을 하기 때문에 수정하기에 용이하고 단점은 한 파일에 모바일, PC의 웹을 다 작.. 2022. 7. 18. 이전 1 다음 728x90 반응형
