CSS - 문제 미리보기

문제 1310

medium
가로형 내비게이션 바에서 `overflow: hidden;`을 `
    `에 적용하는 이유는? ```css ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; } ```
A. 텍스트가 길 때 자르기 위해서
B. `float` 속성으로 인한 레이아웃 문제 해결
C. 스크롤바를 숨기기 위해서
D. 배경색을 제대로 표시하기 위해서

정답: B

• `float` 속성을 사용하면 자식 요소들이 부모의 높이에 영향을 주지 않습니다 • 문제 상황: `
  • ` 요소들이 `float: left;`로 떠있음 부모인 `
      `의 높이가 0이 되어 배경색이 보이지 않음 레이아웃이 깨져 보임 • `overflow: hidden;`의 효과: 새로운 Block Formatting Context(BFC) 생성 떠있는 자식 요소들을 포함하도록 부모 높이 확장 배경색과 테두리가 제대로 표시됨 • 이를 "clearfix" 기법이라고 부르며, float 레이아웃의 필수 기술입니다
  • 💡 학습 팁

    이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.