위클리 페이퍼 1주차

CSS의 Cascading에 대해 설명해 주세요.

• 캐스케이딩은 두가지의 원칙을 통해 어떤 요소에 스타일을 적용할지 결정한다.

1. 스타일 우선순위
   스타일 우선순위는 3가지 요소를 통해 우선순위를 결정한다.

   • 첫번째는 중요도이다.
     중요도는 스타일이 선언된 위치에 따라서 우선순위를 매기는 것이다.
     작성자 스타일 시트 > 사용자 스타일 시트 > 사용자 도구 스타일 시트 순서이다.
     의도적으로 중요도를 끌어올리는 방법이 있는데 속성: 속성값 !important;를 하면 된다.
     !important 작성자 스타일 시트 > !important 사용자 스타일 시트 > 작성자 스타일 시트 > 사용자 스타일 시트 > 사용자 도구 스타일 시트
   • 두번째는 명시도이다.
     명시도는 셀렉터가 가리키는 것이 명확할수록 우선순위를 높게 주는 것을 의미한다
     인라인 > id > class > 태그
   • 세번째는 코드 순서이다.
     코드 순서는 가장 마지막에 등장한 속성을 최우선으로 적용한다는 것이다.

2. 스타일 상속
   스타일 상속은 태그들이 어떻게 포함되었는지에 따라서 스타일을 적용할지 결정하는 원칙이다.

position의 속성들과 각각의 특징을 설명해 주세요.

• 1. static : 웹사이트의 기본 속성값 , top right bottom left 등 위치 속성은 무시된다.
• 2. relative: 원래 위치가 기준이며 left right top bottom값을 통해 움직인다.
• 3. absolute: 가장 가까운 조상에서 left right top bottom 을 이용해 주어진 위치로 움직인다.
     그 조상 태그는 relative, absolute, fixed 속성 중 하나여야 한다.
• 4. fixed : absolute와 비슷하지만 스크롤로 내려도 그 위치에 고정, 무조건 브라우저 창 기준이다.
     width로 너비를 정해주거나 left와 right를 설정하지 않으면 내용의 크기로 크기가 정해진다.
     글의 흐름에서 완전히 빠져서, 요소의 원래 자리는 차지하지 않는다.
• 5. Sticky : relative와 비슷하지만 스크롤로 내리면 fixed처럼 그 위치에 고정된다.
     윈도우 기준으로 relative가 부모에 없으면 fixed처럼 끝까지간다.
     부모에 relative가 있으면 부모범위까지 반응한다.