[CSS] inline-block 과 block의 차이 block 한 줄을 차지하는 블록 수준 요소를 생성한다. 가로 폭 전체를 차지하며, 다른 요소가 옆에 위치할 수 없다. 새로운 줄에서 시작되며, width와 height 속성을 사용하여 가로 폭과 세로 높이를
❓px (픽셀) px는 픽셀 단위로, 고정된 크기를 나타낸다. px 값은 사용자의 화면 해상도에 따라 정확한 크기를 가지게 된다. 주로 레이아웃이나 정확한 크기를 필요로 하는 요소에 사용된다. 예를 들어, 너비나 높이를 고정적으로 지정하거나, 특정한 텍스트 크기를 설정하는 경우에 유용하다. ❓em em은 상대적인 크기를 나타내는 단위다. em 값은 부모...
HTML 요소의 이름을 사용하여 요소를 선택한다.예시: div, p, h1, spanclass 속성을 사용하여 특정 클래스를 가진 요소를 선택한다.예시: .class-nameid 속성을 사용하여 특정 아이디를 가진 요소를 선택한다.예시: 요소의 하위 요소를 선택한다.예
1\. border-width테두리의 굵기를 지정하는 속성픽셀(px), 백분율(%), 또는 사전 정의된 값(thin, medium, thick)을 사용하여 지정할 수 있다. 2\. border-style테두리의 스타일을 지정하는 속성none: 테두리 없음hidden:
뷰포트(viewport)는 웹 페이지가 표시되는 화면 영역을 의미한다.뷰포트는 사용자가 웹 페이지를 볼 때 실제로 보이는 영역으로, 브라우저 창이나 모바일 기기의 화면 크기에 따라 동적으로 변한다.뷰포트 너비의 1/100을 나타내며, 뷰포트의 너비에 상대적인 크기를 지
position 속성의 기본값요소는 일반적인 문서 흐름에 따라 배치되며, top, right, bottom, left, z-index 속성이 적용되지 않는다.요소를 자기 자신을 기준으로 상대적인 위치로 이동시킨다. top, right, bottom, left 속성을 사
요소의 속성 변화를 부드럽게 애니메이션화하는 데 사용된다. 변화가 발생하는 속성과 시간, 타이밍 함수, 지연 시간 등을 설정할 수 있다.transition-property애니메이션을 적용할 속성을 지정한다. 여러 속성을 동시에 애니메이션화할 수 있다.transition
Flex Container (Flex 컨테이너)Flexbox를 적용하는 부모 요소 display: flex 또는 display: inline-flex 속성을 설정하여 정의한다.Flex Items (Flex 아이템)Flex 컨테이너의 자식 요소들을 Flex 아이템이라고
미디어 쿼리(Media Query)는 CSS에서 사용되는 기능으로, 웹 페이지의 미디어(장치 또는 미디어 유형)에 따라 스타일을 조건부로 적용할 수 있게 해준다. 이를 통해 다양한 장치에서 웹 페이지를 적절하게 렌더링할 수 있다.mediaType은 대상 미디어 유형을