CSS :lang() প্সিউডো-ক্লাস সিলেক্টর lang অ্যাট্রিবিউট নির্দিষ্ট করা এলিমেন্ট সিলেক্ট করতে ব্যবহৃত হয়। এটি কন্টেন্টের সাথে যুক্ত নির্দিষ্ট ভাষা টার্গেট করে এবং সেগুলোকে অনুযায়ী স্টাইল করতে সাহায্য করে।
সিনট্যাক্স
সিনট্যাক্স নিম্নরূপ:
:lang(){ /*ঘোষণা*/ }
CSS :lang() প্সিউডো-ক্লাস সিলেক্টরের একটি উদাহরণ দেখি:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> p:lang(it)::after { padding: 20px; content: '~ Italian'; font-style: italic; } p:lang(es)::after { padding: 8px; content: '~ Spanish'; font-style: italic; } p:lang(en)::after { padding: 20px; content: '~ English'; font-style: italic; } </style> </head> <body> <p lang='it'>Bella ciao</p> <p lang='en'>Nice hello</p> <p lang='es'>Bueno adios</p> </body> </html>
আউটপুট
CSS :lang() প্সিউডো-ক্লাস সিলেক্টরের আরেকটি উদাহরণ দেখি:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> div{ margin: 10px; padding: 10px; text-align: center; border: 1px solid black; } div:lang(it)::after { padding: 20px; content: '~ Italy'; font-style: italic; } div:lang(es)::after { padding: 8px; content: '~ Spain'; font-style: italic; } div:lang(nl)::after { padding: 20px; content: '~ Belgium'; font-style: italic; } div:lang(es){ background-image: linear-gradient(red 25%, yellow 25%, yellow 75%, red 75%); } div:lang(it){ background-image:linear-gradient(90deg, #00ae00 33.3%, white 33.3%, white 66.6%, red 66.6%); } div:lang(nl){ background-image:linear-gradient(90deg, black 33.3%, yellow 33.3%, yellow 66.6%, red 66.6%); } </style> </head> <body> <div lang='it'>Rome</div> <div lang='nl'>Brussels</div> <div lang='es'>Madrid</div> </body> </html>
আউটপুট
