writing-mode
를 이용해서 텍스트를 세로로 나열할 수 있습니다.
div {
/* 가로 방향, 기본 값 */
writing-mode: horizontal-tb;
/* 세로 방향, 왼쪽에서 오른쪽으로 */
writing-mode: vertical-lr;
/* 세로 방향, 오른쪽에서 왼쪽으로 */
writing-mode: vertical-rl;
}
.en {
/* 영문일 경우, 해당 속성을 추가해주지 않으면 자동으로 각도가 조절됩니다. */
text-orientation: upright;
}
See the Pen writing-mode by FE4902 (@fe4902) on CodePen.
해당 포스팅은 이 글을 참고하여 작성했습니다.
'HTML·CSS' 카테고리의 다른 글
[CSS] border-width가 변경될 때 레이아웃이 틀어지는 이슈 (0) | 2023.04.23 |
---|---|
[CSS] 미디어쿼리 새로운 문법 (0) | 2023.04.17 |
[CSS] :is()와 :where() (0) | 2023.04.06 |
[HTML] 접근성 좋은 모달 만들기 (0) | 2023.01.18 |
[HTML] 모바일 크롬 브라우저 Toolbar 색상 변경 (0) | 2023.01.13 |