tab-size
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2021년 8월.
CSS tab-size 속성은 탭 문자(U+0009)의 너비를 조절합니다.
구문
css
/* <integer> 값 */ tab-size: 4; tab-size: 0; /* <length> 값 */ tab-size: 10px; tab-size: 2em; /* 전역 값 */ tab-size: inherit; tab-size: initial; tab-size: unset; 값
형식 정의
| 초기값 | 8 |
|---|---|
| 적용대상 | block containers |
| 상속 | yes |
| 계산 값 | the specified integer or an absolute length |
| Animation type | a length |
형식 구문
tab-size =
<number [0,∞]> |
<length [0,∞]>
예제
글자 수로 정의
css
pre { tab-size: 4; /* Set tab size to 4 characters wide */ } 탭 제거
css
pre { tab-size: 0; /* Remove indentation */ } 기본 크기와 비교
다음 예제는 기본 탭 크기를 사용자 지정 탭 크기와 비교합니다. white-space 속성을 pre로 설정해서 탭 문자가 접히지 않도록 했습니다.
HTML
html
<p>no tab</p> <p>	default tab size of 8 characters wide</p> <p class="custom">	custom tab size of 3 characters wide</p> <p> 3 spaces, equivalent to the custom tab size</p> CSS
css
p { white-space: pre; } .custom { tab-size: 3; -moz-tab-size: 3; } 결과
명세
| Specification |
|---|
| CSS Text Module Level 3 # tab-size-property |
브라우저 호환성
같이 보기
- Controlling size of a tab character (U+0009), Anne van Kesteren이 CSSWG에 보낸 이메일.