CSS를 사용하여 텍스트의 세로 배열을 구현하는 방법-CSS 튜토리얼-php.cn

CSS를 사용하여 텍스트의 세로 배열을 구현하는 방법

云罗郡主

풀어 주다： 2018-11-23 17:25:13

원래의

2969명이 탐색했습니다.

이 글의 내용은 CSS를 사용하여 세로 텍스트 배열을 구현하는 방법에 대한 내용입니다. 필요한 친구들이 참고할 수 있기를 바랍니다.

CSS를 사용하여 텍스트의 세로 배열을 구현하는 방법

스타일 시트의 워드 프로세싱 속성에는 쓰기 모드와 텍스트 정렬이라는 두 가지 중요한 속성이 있습니다. 먼저 사용법을 살펴보겠습니다:

1. writing-mode (객체 쓰기 방향 설정)

Syntax: writing-mode: lr-tb, tb-rl

매개변수: lr-tb: 왼쪽에서 오른쪽으로, 위에서 아래로 tb-rl: 위에서 아래로, 오른쪽에서 왼쪽으로

예:

CSS 코드는 내용을 클립보드에 복사합니다

div { writing-mode: tb-rl; }

로그인 후 복사

2 text-align(객체의 텍스트 정렬 설정)

구문: text-align: left, right, center, justify

매개변수: left: 왼쪽 정렬 right: 오른쪽 정렬 center: center justify: 양쪽 끝 정렬

예:

CSS 코드는 내용을 클립보드에 복사합니다

div { text-align : center; }

로그인 후 복사

그리고 일반적으로 일반적인 조판 아이디어: 텍스트 개체의 너비를 설정하면 다음 텍스트의 너비와 거리만 정렬할 수 있습니다. 텍스트가 한 줄에 두 문자를 맞출 수 없으면 텍스트가 자동으로 줄 바꿈됩니다.

CSS 코드는 클립보드에 콘텐츠를 복사합니다.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>竖列排版实例 在线演示 www.divcss8.com</title>
<style>
body{text-align:center}
.shuli{ margin:0 auto;width:20px;line-height:24px;border:1px solid #333}
</style>
</head>
<body>
<div class="shuli">我是竖列排版</div>
</body>
</html>

로그인 후 복사

위는 CSS를 사용하여 수직 텍스트 정렬을 구현하는 방법에 대한 전체 소개입니다. CSS3 튜토리얼에 대해 더 알고 싶다면 PHP 중국어 웹사이트에 주목하세요.

위 내용은 CSS를 사용하여 텍스트의 세로 배열을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!