[CSS] <div> 텍스트 가운데 정렬하는 법!
div의 display는 block입니다
(1)
div의 크기를
width:550px
height:50px
으로 지정해줬어요
여기서 heigth(높이)를 기억해주세요
(2)
가로정렬
text-align : center;
text-align 속성은 텍스트의 정렬 방향을 의미합니다.
(3)
가로정렬을 해줬으면 세로정렬을 해줘야겠죠
주의할점은
line-height의 값을 내가 지정한 height의 값과 동일하게 지정해줍니다.
세로정렬
line-height:50px;
line-height는 줄 간격을 조정합니다. (줄의 높이를 지정)
!!
line-height는 줄간격을 조정하기 때문에
텍스트의 줄이 늘어나면 지정한 행간만큼 다음줄에 입력되는 대참사가 발생한다...
일단 급하게 이 방법을 쓰고 프로젝트할 때는 다른방법을 알아보자
'퍼블리싱' 카테고리의 다른 글
| [CSS] 단위 (%, rem, em, vw, vh) (0) | 2022.03.09 |
|---|---|
| [CSS ]한눈에 정리! Position 속성 완벽 가이드 (0) | 2022.03.07 |
| [CSS] box-sizing 속성 완벽 정리! 개념부터 활용법까지 (0) | 2022.03.05 |
| [CSS] margin/ padding/ border 쉬운 이해 ! (0) | 2022.03.04 |
| [CSS] Display 속성 / 블록, 인라인, 인라인-블록 까지 총정리 ! (0) | 2022.03.04 |