콘텐츠
텍스트를 표시하는 HTML 태그에 포함 된 HTML 정렬 속성을 사용하는 대신 웹 디자이너가 프레젠테이션 정보 (정렬 옵션)를 스타일 시트로 전송하는 것이 좋습니다. 이 기사에서는 텍스트를 정렬하는 방법과 부서와 같이 큰 페이지 요소를 가운데에 배치하는 방법에 대해 설명합니다.
지침
스타일 시트를 사용하면 텍스트보다 정렬하고 가운데에 맞출 수 있습니다. (Fotolia.com에서 6922Designer하여 웹 사이트 레이아웃 이미지)-
단락이나 인용문 같은 일반 텍스트 블록 내에서 텍스트를 정렬하려면 text-align 속성을 사용하십시오.
-
text-align 속성의 값 옵션은 left, right, center 및 justify입니다. 양쪽 맞춤 텍스트는 웹에서 읽을 수 없기 때문에 그림에서는 왼쪽, 오른쪽 및 가운데 맞춤 만 표시합니다. 이 그림에서 너비 조정이 요소에 적용되지 않으면 페이지의 블록 요소 크기를 보여주기 위해 각 단락에 검은 색 테두리가 표시됩니다.
-
일반적으로 요소는 ID 또는 클래스에 할당됩니다. 이 ID 또는 클래스의 항목에 대한 텍스트 맞춤은 다음과 같은 규칙으로 정의됩니다.
왼쪽 {
텍스트 정렬 : 왼쪽; }
오른쪽 {
텍스트 정렬 : 오른쪽; }
센터 {
텍스트 정렬 : 가운데; }
텍스트 정렬 방법
-
전체 레이아웃이나 큰 레이아웃의 가운데에 배치 할 수 있습니다. 이러한 경우 다른 CSS 기술이 사용됩니다.
-
가운데에 놓으려는 가장 큰 요소의 선택자에 CSS 규칙을 적용합니다. 본문 요소, 경계 분할 또는 컨테이너 분할이 될 수 있습니다.
-
이 메서드로 가운데 정렬은 텍스트 정렬에 영향을주지 않습니다. 가운데 맞춤 요소는 가운데 맞춤 요소 내에서 텍스트의 기본 왼쪽 맞춤을 유지합니다.
-
다음은 페이지 중앙에 전체 바디 요소 (명확성을 위해 검은 색 테두리가 있음)를 보여줍니다. 요소에 너비를 설정해야하며 왼쪽 여백과 오른쪽 여백이 자동으로 설정됩니다. 이것은 다음과 같이 수행됩니다.
몸체 (너비 : 80 %; margin-right : 자동; margin-left : 자동; 테두리 : 1px 단색 검정; }
사업부, 등고선 및 본부 부서를 중앙 집중화하는 방법
어떻게
- 일반적으로 왼쪽 정렬은 기본값이므로 align-left를 사용할 필요가 없습니다.그러나 이전에 중앙 집중식 또는 오른쪽 맞춤 텍스트를 나중에 기본값으로 다시 정의해야하는 경우 해당 텍스트가 있음을 인식해야합니다. 가운데 맞춤 할 요소의 너비는 픽셀, 백분율 또는 em으로 정의 할 수 있습니다.
필요한 것
- 텍스트 편집기
- HTML 편집기
- 기본적인 HTML 지식