Text

line-height

글자의 높이를 지정합니다.

line-height의 단위

1. nomal : 기본 값 입니다. 폰트의 font-family에 따른 글자의 기본 높이 입니다. (사용하는 폰트에 따라 기본 line-height 값이 다르다는것에 유의하세요.)
2. number : 숫자로 값을 설정할 수 있습니다. 1은 font-size 값 만큼의 글자 높이를 의미합니다. 2는 font-size 값의 두 배를 의미합니다. 소수점을 지원합니다.
3. px, em, % : 해당하는 유닛 단위에 맞춰 글자의 높이가 설정됩니다. (px은 부모 폰트가 변경될 경우를 대비하여 잘 사용하지 않습니다. em은 상황에 따라 사용할 수 있지만 마찬가지 원리로 부적절한 UI가 구현되는 상황이 있습니다. 단위 없이 사용하는 것을 권해드립니다.)

letter-spacing

글자 사이의 간격을 조절합니다.

letter-spacing의 단위

1. normal : 현재 폰트의 기본 간격입니다.
2. px, em : 기본 간격에 사용하는 유닛 단위만큼 간격을 추가합니다.

text-align

가장 기본적인 텍스트 왼쪽 정렬, 오른쪽 정렬, 가운데 정렬, 양쪽 정렬에 대해서 배워보겠습니다.
텍스트 정렬인 text-align과 관련 있는 속성값은 4가지가 존재 합니다.

left : 기본값으로 텍스트를 왼쪽에 정렬
right : 왼쪽
center : 가운데
justify : 양쪽

가로 정렬을 하며 세로 정렬을 하고 싶은 경우 padding, margin 속성을 추가 하여 사용하면 됩니다.

text-indent

텍스트 라인에서 텍스트가 시작하기 전의 빈 공간을 설정할 수 있습니다. 쉽게 말해 들여쓰기 공간 설정 입니다.

text-indent의 단위

1.mm, cm : 밀리미터, 센티미터 단위를 지원
2. px, em, % : 기본 간격에 사용하는 유닛 단위 만큼 간격을 추가합니다.

text-decoration

텍스트에 붙는 라인을 꾸며주는 속성입니다.
텍스트의 상단, 하단에 라인을 그려주고 종류와 색상도 지정 가능합니다.

하지만 글씨의 폰트 형태에 따라 라인이 잘리는 경우가 있기 때문에 스타일링의 용도로는 잘 사용하지 않습니다.
대신 a 태그의 기본 스타일을 제거할때 가장 자주 쓰이는 속성입니다.

<style>
    a {
      text-decoration:none;
    }
</style>

<a href="https://www.likelion.net/">Hello lion!</a>

vertical-align

인라인 요소가 이어저 나올 경우 이어지는 인라인 요소의 높이를 맞추기 위해 사용하는 것(파워포인트의 요소 높이 맞추기와 같은 기능)
img 태그의 바깥쪽 공백을 없애기 위하여 자주 사용합니다.