:focus
:focus সিলেক্টর ব্যবহার করা হয় ফর্ম এলিমেন্ট (বাটন, লিংক, ইনপুট বক্স) ফোকাস পেলে একটি নির্দিষ্ট স্টাইল প্রয়োগ করতে। একটি এলিমেন্ট মাউস বা ট্যাব কী ব্যবহার করে ফোকাস পেতে পারে। ফোকাস এলিমেন্টে থাকে যতক্ষণ না অন্য কোনো এলিমেন্ট ফোকাস পায়।
:active
:active সিলেক্টর ব্যবহার করা হয় একটি অ্যাঙ্কর ট্যাগ সক্রিয় কিনা বা একটি বাটন সক্রিয় কিনা তা নির্দেশ করতে। মাউস ডাউন থাকলে active সিলেক্টর প্রয়োগ হয় এবং মাউস ডাউন থাকা পর্যন্ত প্রয়োগ থাকে।
উদাহরণ
নিচের উদাহরণটি বাটন এবং লিংকে :focus এবং :active সিলেক্টরের ব্যবহার দেখায়।
<!DOCTYPE html> <html> <head> <title>Selector Example</title> <style> button { border: 2px solid black; } button:focus { border: 2px dotted red; } a { color: black; } a:active { color: red; } </style> </head> <body> <button type="submit">Focus Me</button> <a href="#">Active Me</a> </body> </html>
আউটপুট
