CSS - 문제 미리보기

문제 1095

hard
다음 두 코드는 완전히 동일한 결과를 만듭니다. 이때 빈칸에 들어갈 값은?
```css
/* 코드 A */
.section {
background-color: white;
background-image: url("pattern.gif");
background-repeat: repeat-x;
background-position: left bottom;
}

/* 코드 B */
.section {
background: ______ ______ ______ ______ ______;
}
```
A. `white url("pattern.gif") repeat-x left bottom`
B. `url("pattern.gif") white repeat-x left bottom`
C. `white repeat-x url("pattern.gif") left bottom`
D. `left bottom white url("pattern.gif") repeat-x`

정답: A

개별 속성을 단축 속성으로 변환할 때는 정확한 순서를 지켜야 하며, 모든 값이 올바른 위치에 있어야 합니다.

색상 → 이미지 → 반복 → 고정 → 위치
white → url("pattern.gif") → repeat-x → (생략) → left bottom

실무 팁:
단축 속성을 사용할 때는 순서를 외우기보다는 "색상-이미지-반복-고정-위치"라는 논리적 흐름으로 기억하면 쉽습니다.

💡 학습 팁

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