English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS 참조 가이드

CSS @규칙(RULES)

CSS 속성 전체

CSS3 outline-offset 속성 사용 방법 및 예제

outline-offset CSS 속성은 outline을 설정합니다.-offset CSS 속성은 경계선과 경계선 또는 요소 경계와의 공간을 설정합니다. 경계선 또는 요소 경계와의 공간.

아래 표는 이 속성의 사용 설명과 버전 기록, 그리고 이 속성이 JavaScript 스크립트에서 사용하는 문법을 설명합니다.

기본 값:0
적용:모든 요소
thừa kế:없음
애니메이션 가능:네.참조: 애니메이션 속성
버전: CSS3의 새 기능
JavaScript 문법:object.style.outlineOffset="15px"

outline-offset 사용 문법

이 속성의 문법은 다음과 같습니다:

outline-offset: length | initial | inherit

아래 예제는 outline을 사용하는 방법을 보여줍니다-offset 속성.

p {
    border: 2px solid red;
    outline: 2px solid green;
    outline-offset: 10px;
}
테스트해 보세요‹/›

속성 값

아래 표는 이 속성의 값을 설명합니다.

설명
length쌍선선도와 경계선 사이의 거리를 지정합니다. 기본 값은 0입니다. 음수 값은 쌍선을 요소 내에 배치합니다.
initial이 속성을 기본 값으로 설정합니다.
inherit지정된 경우, 관련 요소는 부모 요소의 outline을 사용합니다.-offset의 속성 값.

브라우저 호환성

outline-offset 속성의 브라우저 호환성, 아래 표의 숫자는 이 속성을 지원하는 브라우저의 최소 버전 번호를 나타냅니다; 모든 주요 브라우저는 이 속성을 지원합니다.

  • Firefox 3.5+

  • Google Chrome4+

  • 인터넷 익스플로러 ×

  • Apple Safari 3.1+

  • 오페라 10.5+

더 읽기

다음 튜토리얼을 참조하십시오:CSS 대纲CSS 경계선

관련 속성:outlineoutline-widthoutline-styleoutline-color