Day64 - [css] 미디어쿼리

이번에는 미디어 쿼리에 대해서 간단하게 알아 봅시다. 미디어 쿼리 css 를 사용해서 프론트엔드( 화면에 보여지는 부분. UI ) 를 만들면서, 인터넷 브라우저 창의 크기를 늘리기도 하고, 줄이기도 해 보셨을 겁니다. 그리고 인터넷 창을 pc 뿐 아니라 핸드폰 , 태블릿pc 를 이용해서 켜보신 적이 있을 겁니다. 각각의 기기에서 인터넷 창이 화면에 맞게 적용되게 하기 위해서 미디어 쿼리를 사용합니다. 미디어 쿼리는 안에 @media ( 화면크기 ) { 실행내용 } 을 사용 합니다. 기기가 바뀌면 화면크기 도 변하는 거겠죠? 그렇기 때문에 화면크기를 가지고 디자인을 해주면 됩니다. pc에서 간단하게 화면크기를 변화시키는 방법으로는 , F12 를 누르고 아래의 버튼을 클릭 합니다. 이렇게 하면, 휴대폰 , ..

2021.05.18