CSS

Cascading Style SheetHTML 등의 마크업 언어로 작성된 문서가 실제로 웹사이트에 표현되는 방법을 정해주는 언어.CSS의 C가 Cascading의 약자인데, 이는 상위 요소의 스타일 속성을 자손 요소들에게 상속시켜주는 모습이 DOM 트리구조에서 마치 폭

대부분 브라우저의 폰트 사이즈 기본값은 16px, 1em, 100%프로퍼티 값이 0인 경우, 단위를 생략픽셀 : 화면을 구성하는 단위1px은 화소 1개 크기를 의미해상도에 따라 상대적인 크기를 가짐대부분의 브라우저는 1px을 1/96인치의 절대단위로 인식em : em은

content \- 실제 내용 위치 \- width(요소의 너비), height(요소의 높이) 프로퍼티paddingborder(테두리) 안에 위치하는 여백 영역 \- padding 프로퍼티 값 : 패딩 영역의 두께 \- 기본색 : 투명border - 테두리 영역 \-

float 속성을 자식 엘리먼트에 사용하게 되면 부모 엘리먼트가 자식의 높이를 감지할 수 없기 때문에 이를 반영하기 위한 방법이 필요하다. 다음 코드를 가정으로 한다.자식을 포함할 만큼만 너비로 줄어듦부모가 겹겹이 있을 경우 계속해서 float 시켜야 함overflow

마진겹침 현상 마진겹침(Margin-Collpasing)이란 블록 레벨 엘리먼트(Block-level element)에 한해서 발생하는 현상으로, 좌우 방향으로는 적용되지 않고 오로지 수직방향 으로 적용된다. 2개의 마진이 겹칠 때 더 큰 마진으로 덮어 씌우는 방식이

크롬, 사파리, IE 등 각 브라우저마다 HTML 요소의 기본 스타일을 가지고 있다. 따라서, CSS로 스타일링을 적용할 때 이러한 특징이 동일한 스타일 적용을 방해하기 때문에 이를 해결하기 위해서 나온 스타일 초기화 기법들이다.모든 브라우저 내장 스타일을 없애는 기법

그리드 시스템 그리드 레이아웃을 구현하기 위해 설계한 시스템으로 너비 960px 혹은 1200px 기준으로 정해놓은 시스템들이 있다. 열(Column)의 개수에 따라 12단/16단/24단 그리드라고 부르기도 한다. 그리드 레이아웃을 구현하는 방법은 여러가지가 있으며

MDN의 정의를 보면,BFC는 웹페이지의 블록 레벨 요소를 렌더링하는데 사용되는 CSS의 비주얼 서식 모델 중 하나이다.즉, 블록 레벨 요소가 포함되는 서식모델 이다.BFC가 생성되기 위해선 다음과 같은 조건 중 하나를 만족해야 한다.루트 혹은 이를 포함하는 요소flo

z-index를 이해하기 위해선 먼저, 쌓임 맥락(Stacking Context)의 개념을 이해해야 한다. 쌓임 맥락이란, HTML 요소들에 사용자를 바라보는 기준으로 가상의 z축을 생성하여 3차원 개념으로 보는 것 이다. 따라서, 쌓임 맥락을 형성한다는 것은 자신만의

위와 같이 마크업이 되어있다고 했을때 다음 방법들을 사용할 수 있다.원래 div 는 부모의 너비만큼 너비를 갖기 때문에 자신의 너비가 있다 하더라도 보이지 않는 공간이 있다. 이런 특성 때문에 margin: 0 auto 와 같이 가로 가운데 정렬을 할 수 있는데, po

<img> 태그를 사용할 때 기본적으로 아래쪽에 공백이 생긴다.<img> 태그는 인라인-레벨 요소이기 때문에 기본적으로 일반 텍스트와 동일하게 baseline 기준으로 정렬이 된다. 이 말은 즉, vertical-align: baseline 이 기본값이라는