CSS text-justify প্রোপার্টি আমাদের একটি এলিমেন্টের জন্য জাস্টিফিকেশন টাইপ নির্দিষ্ট করতে সাহায্য করে। text-align প্রোপার্টি একটি এলিমেন্টে টেক্সটের অনুভূমিক্যালাইনমেন্ট সেট করে।
উদাহরণ
নিচের উদাহরণগুলো CSS text-justify প্রোপার্টি প্রদর্শন করে।
<!DOCTYPE html> <html> <head> <style> article { margin: 3%; background-color: peachpuff; text-align: justify; } p:first-of-type{ text-justify: inter-character; background-color: moccasin; } </style> </head> <body> <article> <p>Nullam in fringilla ex, at sagittis erat. Praesent imperdiet augue at ante tempor, eu condimentum tellus consectetur. Mauris rutrum, lectus quis porta bibendum, arcu neque dictum orci, sed volutpat ipsum risus in ex. Suspendisse potenti. Nam rhoncus ultricies nisi pulvinar rutrum. Mauris ullamcorper interdum urna a vulputate. Quisque dolor tortor, vehicula in odio eu, fringilla rutrum est. Nunc viverra congue aliquam. Ut volutpat magna ipsum, in interdum velit mollis ac. </p> <p>Nullam in fringilla ex, at sagittis erat. Praesent imperdiet augue at ante tempor, eu condimentum tellus consectetur. Mauris rutrum, lectus quis porta bibendum, arcu neque dictum orci, sed volutpat ipsum risus in ex. Suspendisse potenti. Nam rhoncus ultricies nisi pulvinar rutrum. Mauris ullamcorper interdum urna a vulputate. Quisque dolor tortor, vehicula in odio eu, fringilla rutrum est. Nunc viverra congue aliquam. Ut volutpat magna ipsum, in interdum velit mollis ac.</p> </article> </body> </html>
আউটপুট
এটি নিচের ফলাফল দেবে −
উদাহরণ
<!DOCTYPE html> <html> <head> <style> dl { margin: 3%; background-color: lightcoral; text-align: justify; } #example{ text-justify: inter-character; background-color: snow; } </style> </head> <body> <dl> <dt> Quisque dolor tortor, vehicula in odio eu, fringilla rutrum est.</dt> <dd>Nunc viverra congue aliquam. <p id="example">Nullam in fringilla ex, at sagittis erat. Praesent imperdiet augue at ante tempor, eu condimentum tellus consectetur.</p> </dd> </dl> <dl> <dt> Quisque dolor tortor, vehicula in odio eu, fringilla rutrum est.</dt> <dd>Nunc viverra congue aliquam. <p>Nullam in fringilla ex, at sagittis erat. Praesent imperdiet augue at ante tempor, eu condimentum tellus consectetur.</p> </dd> </dl> </body> </html>
আউটপুট
এটি নিচের ফলাফল দেবে −
