CSS 크기 단위 CSS 크기 단위는 대표적으로 px, %, em, rem 등이 있습니다. 하나하나 살펴보도록 합시다. px px는 픽셀 단위입니다. 1px은 화소 1개 크기를 의미하죠. 우리가 보는 디스플레이는 모두 아주 작은 픽셀이 모여 이루어져 있습니다. px은 디바이스 해상도에 따라 상대적은 크기를 갖습니다. 따라서 브라우저는 1px을 1/96 인치의 절대단위로 인식합니다. px은 요소의 크기나 이미지의 크기 지정에 주로 사용됩니다. % %는 백분율 단위의 상대적인 단위입니다. 요소에 지정된 사이즈에 상대적인 사이즈로 지정됩니다. em em은 배수 단위로 상대적인 단위입니다. 요소에 지정된 사이즈에 상대적인 사이즈로 지정됩니다. 예를 들어 1em은 요소에 지정된 사이즈와 같고 2em은 지정된 사이..

선택자(Selector) 선택자는 CSS에서 HTML 요소를 가리킬 때 사용합니다. 선택자를 활용하여 여러 요소 중 원하는 요소만 특정하여 CSS를 적용할 수 있습니다. 전체 선택자 ’*’을 사용하며 모든 요소를 선택합니다. 태그 선택자 태그명에 해당하는 요소를 모두 선택합니다. ID 선택자 요소 어트리뷰트의 id와 일치하는 요소를 선택합니다. id는 HTML 문서 내에서 유일한 값입니다. 클래스 선택자 요소 어트리뷰트의 class와 일치하는 요소를 선택합니다. class는 HTML 문서 내에서 중복될 수 있습니다. 어트리뷰트 선택자 선택자[어트리뷰트]: 선택자의 어트리뷰트가 일치하는 요소들을 선택합니다. 선택자[어트리뷰트=“값”]: 어트리뷰트의 값까지 일치하는 요소들을 선택합니다. 선택자[어트리뷰트~=..

CSS CSS(Cascading Style Sheet)는 HTML 요소들이 브라우저 상에서 보여지는 스타일을 정의한 스타일 시트 언어입니다. HTML의 어트리뷰트로만 스타일을 모두 작성하면 작성도 힘들 뿐더러 동적인 스타일 변경 및 유지보수가 매우 힘듭니다. 이러한 문제점을 해결하기 위해 W3C에서 만든 스타일 언어가 CSS입니다. CSS는 웹 페이지의 스타일을 별도의 파일로 저장할 수 있으므로 사이트의 전체 스타일을 손쉽게 제어할 수 있습니다. 또한, 웹 사이트의 스타일을 일관성 있게 유지할 수 있게 해주며, 그에 따른 유지보수 또한 쉬워집니다. 이러한 외부 스타일 시트는 보통 .css의 확장자로 저장됩니다. 문법 CSS의 문법은 선택자(selector)와 선언부(declaratives)로 구성됩니다...