집 > 기사 > 웹 프론트엔드 > CSS를 사용하여 div 내부의 텍스트를 오른쪽으로 이동합니다.

CSS를 사용하여 div 내부의 텍스트를 오른쪽으로 이동합니다.

青灯夜游원래의: 2021-02-22 15:58:4011355검색

CSS에서는 div 요소에 "text-align: right;" 스타일을 추가하여 div 내부의 텍스트를 오른쪽으로 이동할 수 있습니다. text-align 속성은 요소 내 텍스트의 가로 정렬을 설정할 수 있습니다. 속성 값을 "right"로 설정하면 텍스트를 오른쪽으로 정렬할 수 있습니다.

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

css는 div의 텍스트를 오른쪽으로 구현합니다

//文字右边对齐
div{text-align: right;}

text-align 속성은 요소에 있는 텍스트의 가로 정렬을 지정합니다.

이 속성은 줄 상자가 정렬되는 지점을 지정하여 블록 수준 요소 내에서 텍스트의 가로 정렬을 설정합니다. 사용자 에이전트가 줄 내용의 문자와 단어 사이의 간격을 조정할 수 있도록 허용함으로써 값 정렬이 지원됩니다. 다른 사용자 에이전트는 다른 결과를 얻을 수 있습니다.

값	설명
left	텍스트를 왼쪽으로 정렬합니다. 기본값: 브라우저에 의해 결정됩니다.
right	텍스트를 오른쪽으로 정렬하세요.
center	텍스트를 가운데로 정렬하세요.
justify	텍스트를 양쪽 끝으로 정렬하는 효과를 얻으세요.

[추천 튜토리얼: CSS 비디오 튜토리얼 ]

예:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style type="text/css">
			div{
				width: 500px;
				padding: 10px;
				background: palegoldenrod;
			}
			.box{
				text-align: right;
			}
		</style>
	</head>

	<body>
		<div>div中的测试文本--默认</div>
		<div class="box">div中的测试文本--右边对齐</div>
	</body>

</html>

Rendering:

CSS를 사용하여 div 내부의 텍스트를 오른쪽으로 이동합니다.

더 많은 프로그래밍 관련 지식을 보려면 프로그래밍 비디오를 방문하세요! !

위 내용은 CSS를 사용하여 div 내부의 텍스트를 오른쪽으로 이동합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

html5 css css3

성명：

이전 기사：일반적으로 CSS 파일을 무엇이라고 합니까?다음 기사：일반적으로 CSS 파일을 무엇이라고 합니까?