본문 바로가기

뷰포트2

MGS Day 07 DOM이란 Document Object Model(문서 객체 모델)의 줄임말로, HTML 문서를 구조화하여 접근할 수 있는 객체로 만들어 놓은 것. 브라우저가 HTML 문서를 해석한 결과라고 말하기도 함. DOM API란 이런 DOM에 접근해 우리가 원하는대로 HTML 요소를 수정, 추가, 삭제할 수 있도록 만들어져 있는 함수들. CSS에서의 단위 1. px (픽셀) 디바이스 화면에서 표현하는 하나의 점 (갯수) 2. % (퍼센트) 특정 요소의 부모 요소 크기를 기준으로 하는 백분율 cf. margin이나 padding에 %를 사용할 경우 해당 %는 가로 크기를 기준으로 한다. ex. 요소 상단에 여백을 줬을 때, 화면이 가로로 늘어나면 해당 요소의 세로 여백도 늘어나게 된다 ! 3. em (이엠) 특정.. 2022. 7. 6.
[프론트엔드][CSS] TIL Day-14.2 Media Queries 미디어 쿼리 미디어 쿼리(media queries)는 접속하는 장치 즉, 미디어에 따라 사이트의 형태가 바뀌도록 같은 스타일시트 내에서 서로 다른 미디어에 다른 스타일을 적용하도록 지정하게 하는 것을 가리킨다. 이를 위해 CSS2에서 도입된 미디어 타입을 이용하면 @media 규칙을 통해 다양한 미디어 유형에 맞춰 서로 다른 스타일을 지정할 수 있었다. CSS2의 미디어 타입을 확장한 CSS3의 미디어 쿼리는 단지 미디어 타입을 지정하는 것 뿐만 아니라 뷰포트의 크기(폭, 높이), 장치의 크기, 화면의 가로/세로 방향, 해상도 등 미디어 타입의 특성을 구분할 수 있는 다양한 기능을 이용할 수 있게 되었다. 그럼으로써, CSS3의 미디어 쿼리는 반응형 웹을 구현하는 중요한 기능으로 사용되게 되었다. 미디어 쿼리의 문법.. 2022. 4. 15.