CSS 공통 텍스트 속성의 텍스트 정렬 요약

이 글에서는 앞서 언급한 text-indent 속성에서 일반적으로 사용되는 CSS 텍스트 속성

의 text-align 요약을 소개합니다. 텍스트 들여쓰기를 달성하는 데 사용되는 오늘날의 텍스트 정렬 사용률은 텍스트 들여쓰기보다 훨씬 높습니다. 제가 현재 진행하고 있는 프로젝트를 예로 들면 수평 센터링과 수직 센터링을 가장 많이 사용하게 될 텐데요, 먼저 문법을 살펴보겠습니다!

텍스트 정렬

허용된 값왼쪽| 가운데 | 오른쪽 | 그냥ify | >초기값은 사용자 에이전트와 관련됩니다

상속될 수 있나요

상속

예블록 수준 요소에 적용 가능

text-align은 또 다른 것입니다 요소의 블록 수준 속성에만 적용 가능한 것, 링크 또는

이미지

를 행의 중앙에 배치하려는 경우 나머지 행의 정렬에 관계없이 작동하지 않습니다. 먼저 아래 의 전체 그림을 통해 텍스트 정렬 효과를 경험해 보겠습니다.
text-align의 4가지 속성 값 표시 그림은 다음과 같습니다

위 표시는 text-align의 속성 규칙을 매우 직관적으로 보여줍니다. text-align:justify는 각 브라우저에서 일관되게 동작하지 않습니다. 개인적으로 정의는 적용 시나리오가 많지 않다고 생각합니다.

응용 시나리오:

1. UI 다이어그램은 한마디로 디자인을 따르기만 하면 됩니다.

2. 이미지의 가운데 정렬: img에만 text-align을 사용하면 효과가 없습니다. text-align은 인라인 요소와 대체되지 않는 요소에만 사용할 수 있습니다. 요소. 따라서 이미지를 중앙에 맞추려면

솔루션을 변환해야 합니다.

텍스트 정렬에 대한 피상적인 논의는 여기까지입니다. 직접 시도해 보세요.

위 내용은 CSS 공통 텍스트 속성의 텍스트 정렬 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!