@media2 [프론트엔드][CSS] TIL Day-14.2 Media Queries 미디어 쿼리 미디어 쿼리(media queries)는 접속하는 장치 즉, 미디어에 따라 사이트의 형태가 바뀌도록 같은 스타일시트 내에서 서로 다른 미디어에 다른 스타일을 적용하도록 지정하게 하는 것을 가리킨다. 이를 위해 CSS2에서 도입된 미디어 타입을 이용하면 @media 규칙을 통해 다양한 미디어 유형에 맞춰 서로 다른 스타일을 지정할 수 있었다. CSS2의 미디어 타입을 확장한 CSS3의 미디어 쿼리는 단지 미디어 타입을 지정하는 것 뿐만 아니라 뷰포트의 크기(폭, 높이), 장치의 크기, 화면의 가로/세로 방향, 해상도 등 미디어 타입의 특성을 구분할 수 있는 다양한 기능을 이용할 수 있게 되었다. 그럼으로써, CSS3의 미디어 쿼리는 반응형 웹을 구현하는 중요한 기능으로 사용되게 되었다. 미디어 쿼리의 문법.. 2022. 4. 15. [프론트엔드][CSS] TIL -Day 11.1 @-규칙 @-규칙 @-규칙은 식별자(identifier)가 뒤따르는 at 기호('@')로 시작하는 CSS문이며 다음 세미콜론(';') 또는 다음 CSS 블록 중 먼저 오는 쪽까지의 모든 것을 포함하는 범위 안에서 적용된다. CSS at-규칙 특징 예시 예시의 의미 중첩 명령문이 아님 ㅡ 조건부 그룹 @규칙 내에서 사용할 수 없음 @charset 스타일 시트에 쓰이는 문자 인코딩을 지정, 스타일 시트의 첫 번째 요소여야 함, 여러 @charset이 정의된 경우 첫 번째 것만 사용되고, 요소 내에서 사용될 수 없음 @charset "utf-8"; 브라우저에게 utf-8 character set을 사용한다고 알려라. @import 다른 스타일 시트에서 스타일 규칙을 가져올 때 사용, CSS 엔진에게 외부 스타일 시트를.. 2022. 4. 11. 이전 1 다음
