아무거나 하는 블로그

- 인접한 두 요소간, 그리고 부모-자식 요소간 margin중에서 큰 margin만 적용되는 현상 - 인접한 두 요소 간에, 예를 들어 위 아래로 인접한 두 요소 간에는 margin 값이 둘다 적용되는 것이 아니라 위 요소의 margin-bottom 값과 아래 요소의 margin-top 값 중에서 큰 값 하나만 적용된다. - 부모 - 자식 관계의 요소에서는 부모요소의 시각적 효과가 전혀 없는 투명한 요소일 경우, 부모와 자식 margin 중에서 큰 값 하나만 적용된다. - 또한, 특정 요소에 표시할 내용이 없는 투명한 요소의 경우 margin-top과 margin-bottom 중 큰 값 하나만 적용된다.

- html 요소들은 보이지 않지만 box 안에 쌓여져있는 형태로 존재한다. - 그런 html 요소들의 종류는 크게 inline, block 으로 나뉘어진다. inline은 말 그대로 줄 바꿈 없이 라인에 그대로 적용되는 것으로 해당 부분만큼 box로 쌓여있다. - block 요소는 줄바꿈 후 그 한줄 전체를 차지하는 것으로, 요소를 포함한 한줄 전체가 box로 쌓여있다. - box의 크기는 border 속성을 줘서 확인할 수 있으며, inline, block 속성 또한 style을 통해 각 요소의 기본값이 아닌 다른 값으로 변경할 수 있다. - box 요소 중에 height, width 요소는 inline 요소에는 적용되지 않는다. 즉 inline의 height, width 는 고정적이다.

- CSS는 기본적으로 selector + declaration 으로 구성 - selector 종류: - tag selector (그냥 tag) - id selector (#아이디) - class selector (.클래스) - 자손 selector ( a b : a가 조상 b는 그 하위의 자손) - 직계 자손 selector ( a>b : a가 조상 b는 그 직계 자손) - 동시에 여러 개 selectr (a, b)

- 최초 HTML에는 정보만을 표시하는 tag들 밖에 없었음 - 조금 더 아름다운 웹 페이지를 위해 디자인을 위한 tag들이 생기기 시작 - 정보(순수 HTML)와 디자인 요소(디자인 tag)를 분리해야겠다고 판단하여, CSS를 만들게됨 - 'html 내의 style태그 안의 내용은 CSS로 해석하세요~' 로 약속!