text-indent
들여쓰기와 내어쓰기는 text-indent 속성으로 만듭니다. 값이 양수이면 들여쓰기, 값이 음수이면 내어쓰기가 됩니다. 기본값은 0입니다.
기본형
text-indent : value
- value : 크기를 지정합니다. 음수 값도 사용할 수 있습니다.
예제
다음은 들여쓰기와 내어쓰기를 한 간단한 예제입니다. 내어쓰기를 할 경우 속성 값을 음수로 하고 좌측에 여백을 줍니다.
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet. <span>Proin gravida velit dictum dui consequat malesuada.</span></p>
<p class="indent1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet. <span>Proin gravida velit dictum dui consequat malesuada.</span></p>
<p class="indent2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean nec mollis nulla. Phasellus lacinia tempus mauris eu laoreet. <span>Proin gravida velit dictum dui consequat malesuada.</span></p>
.indent1 {
text-indent: 2em;
}
.indent2 {
text-indent: -2em;
margin-left: 2em;
}
로딩 중... 잠시만 기다려주세요.
자바스크립트를 허용해주세요.