CSS text-align 속성을 사용하여 요소의 텍스트를 가로로 설정할 수 있습니다. 왼쪽, 오른쪽, 양쪽 맞춤 또는 가운데로 설정할 수 있습니다.
구문
CSS text-align 속성의 구문은 다음과 같습니다 -
Selector { text-align: /*value*/ }
예시
다음 예제는 CSS text-align 속성을 보여줍니다 -
<!DOCTYPE html> <html> <head> <style> div { margin: auto; padding: 8px; max-width: 200px; border: thin solid; } p { text-align: right; } div:nth-child(3) { text-align: center; } div:last-child { text-align: justify; } </style> </head> <body> <h2>Student Examination Details</h2> <div> <div>Student John</div> <div> Student Tom <p>Did not appeared for the exams.</p> </div> <div>Student Brad</div> <div>Did not appeared for only the last exam.</div> </div> </body> </html>
출력
이것은 다음 출력을 제공합니다 -
예시
<!DOCTYPE html> <html> <head> <style> td { padding: 10px; box-shadow: inset 0 0 21px yellow; } td:first-of-type { text-align: right; } </style> </head> <body> <h2>Demo Heading</h2> <table> <tr> <td>This is it!</td> </tr> <tr> <td>Well, this is a demo text!</td> </tr> </table> </body> </html>
출력
이것은 다음 출력을 제공합니다 -