CSS 강좌 | Property > word-spacing

개요

word-spacing은 단어 사이의 간격을 정하는 속성입니다.

  • 기본값 : normal
  • 상속 : Yes
  • 애니메이션 : Yes
  • 버전 : CSS Level 1

문법

word-spacing: normal | length | initial | inherit
  • normal : 기본값입니다.
  • length : 길이를 입력합니다.
  • initial : 기본값으로 설정합니다.
  • inherit : 부모 요소의 속성값을 상속받습니다.

길이 값이 클수록 단어 사이의 간격이 커집니다. 길이에는 음수를 넣을 수 있습니다.

예제

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>CSS</title>
    <style>
      .a {
        word-spacing: -5px;
      }
      .b {
        word-spacing: 0px;
      }
      .c {
        word-spacing: 5px;
      }
      .d {
        word-spacing: 10px;
      }
    </style>
  </head>
  <body>
    <p><code>word-spacing: -5px;</code></p>
    <p class="a">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p><code>word-spacing: 0px;</code></p>
    <p class="b">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p><code>word-spacing: 5px;</code></p>
    <p class="c">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
    <p><code>word-spacing: 10px;</code></p>
    <p class="d">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  </body>
</html>

브라우저 지원

  • Chrome : 1.0+
  • Firefox : 1.0+
  • Internet Explorer : 6.0+
  • Opera : 3.5+
  • Safari : 1.0+

참고

Category

Created on 2015-04-09 20:06 | Updated on 2017-04-26 08:48

이 글을 공유하기

Kakao

Book navigation