CSS background-origin 속성
정의와 사용법
background-origin 속성이 정의합니다 배경-위치 속성이 무엇에 대해 위치를 정합니다.
비고:배경 이미지가 background-attachment 속성은 "fixed“”，이 속성은 효과가 없습니다.
다른 것을 참조하세요:
CSS 강의:CSS 배경、CSS 배경(고급)
HTML DOM 참조 매뉴얼:backgroundOrigin 속성
예제
배경 이미지를 내용 상자에 대해 위치를 정합니다:
div
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-position:left;
background-origin:content-box;
}
CSS 문법
background-origin: padding-box|border-box|content-box;
속성 값
| 값 | 설명 | 테스트 |
|---|---|---|
| padding-box | 배경 이미지는 내간격 상자에 대해 위치를 정합니다. | 테스트 |
| border-box | 배경 이미지는 경계 상자에 대해 위치를 정합니다. | 테스트 |
| content-box | 배경 이미지는 내용 상자에 대해 위치를 정합니다. | 테스트 |
기술 세부 사항
| 기본값: | padding-box |
|---|---|
| 상속성: | no |
| 버전: | CSS3 |
| JavaScript 문법: | object.style.backgroundOrigin="content-box" |
브라우저 지원
표格에 표시된 숫자는 이 속성을 최초로 지원하는 브라우저 버전을 나타냅니다.
| 크롬 | 엣지 | 파이어폭스 | 사파리 | 오페라 |
|---|---|---|---|---|
| 크롬 | IE / 엣지 | 파이어폭스 | 사파리 | 오페라 |
| 4.0 | 9.0 | 4.0 | 3.0 | 10.5 |
