html, css 띄어쓰기 적용 (white-space:pre), 공백 적용

html, css 띄어쓰기 적용 (white-space:pre), 공백 적용 

웹 서비스에 공백, 띄어쓰기를 적용하려면 &nbsp를 활용합니다. 

하지만 한번씩 ... 매번 넣기 힘들때가 있어요 ....

그때 white-space:pre 스타일을 이용합니다. 

 

 

<a> 테그 안에 띄어쓰기를 아래와 같이 적용하면 

<style>
    a {
        white-space: pre;
    }
</style>
<div>
    <a>
        a        b           c
             e        f 
             
                                                     g
    </a>
</div>

 

 

 

다음과 같은 결과를 확인 할 수 있습니다 !

 

a b c e f g

 

 

코드팬을 통해서도 확인 가능 합니다.

See the Pen whitespace pre by hyunho (@momalcy) on CodePen.