HTML - 문제 미리보기

문제 936

hard
다음 코드의 실행 결과로 올바른 설명은?

```html
<p>이것은 단락입니다.
<div style="display:inline;">인라인으로 표시된 div</div>
계속되는 텍스트입니다.
</p>
<span style="display:block;">블록으로 표시된 span</span>
<span>일반 span</span>
```
A. 모든 요소가 한 줄에 표시됨
B. div는 새 줄에서 시작하고, 두 span은 한 줄에 표시됨
C. 첫 번째 줄에는 단락과 div가, 두 번째 줄에는 첫 번째 span이, 세 번째 줄에는 두 번째 span이 표시됨
D. CSS display 속성이 적용되지 않음

정답: C

CSS의 `display` 속성은 요소의 기본 표시 방식을 변경할 수 있습니다:

• `<p>` 내부의 `<div style="display:inline;">`는 인라인으로 표시되어 텍스트 흐름을 끊지 않습니다. 따라서 "이것은 단락입니다. 인라인으로 표시된 div 계속되는 텍스트입니다."가 한 줄에 표시됩니다.
• `<span style="display:block;">`는 블록 요소처럼 동작하여 새로운 줄에서 시작합니다.
• 마지막 `<span>`은 일반 인라인 요소이지만, 앞의 블록 span 다음 줄에서 시작합니다.

이는 CSS가 HTML 요소의 기본 표시 특성을 어떻게 변경할 수 있는지 보여주는 중요한 예시입니다.

💡 학습 팁

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