CSS text-align প্রোপার্টি ব্যবহার করে আমরা একটি এলিমেন্টের টেক্সটকে হরিজন্টালি সেট করতে পারি। আমরা এটি left, right, justify বা center সেট করতে পারি।
সিনট্যাক্স
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>
আউটপুট
এটি নিম্নলিখিত আউটপুট দেয়:
