কম্পিউটার টিউটোরিয়াল

CSS ব্যবহার করে এক্টিভ লিংকের চারপাশের ডটেড লাইন মুছে ফেলা


হাইপারলিংকের ডিফল্ট বিহেভিয়ার হলো এক্টিভ বা ফোকাসড থাকলে নিজের চারপাশে একটি ডটেড আউटलাইন দেখানো। CSS outline প্রপার্টি এক্টিভ/ফোকাসড লিংকে none সেট করে এই ডিফল্ট বিহেভিয়ার সরিয়ে ফেলা যায়।

সমাধান

a, a:active, a:focus {    outline: none; }

উদাহরণ

এক্টিভ লিংকের চারপাশের ডটেড লাইন মুছে ফেলার উদাহরণ:

<!DOCTYPE html> <html> <head> <title>Remove dotted line around links using css</title> </head> <style> div {    color: #000;    padding:20px;    background-image: linear-gradient(135deg, #dc3545 0%, #9599E2 100%);    text-align: center; } a, a:active, a:focus {    outline: none; } </style> <body> <div> <h1>HTML Links Demo</h1> <a href="https://google.com" target="_blank">Go To Google</a> </div> </body> </html>

আউটপুট

উপরোক্ত কোডের আউটপুট:

সমাধান প্রয়োগ করার আগে:

CSS ব্যবহার করে এক্টিভ লিংকের চারপাশের ডটেড লাইন মুছে ফেলা

সমাধান প্রয়োগ করার পরে:

CSS ব্যবহার করে এক্টিভ লিংকের চারপাশের ডটেড লাইন মুছে ফেলা


  1. CSS ব্যবহার করে এক্টিভ লিংকের চারপাশের ডটেড লাইন মুছে ফেলা

  2. CSS ব্যবহার করে এলিমেন্টের চারপাশে মার্জিন স্পেস সেট করা

  3. CSS দিয়ে লিংকের রঙ সেট করা

  4. CSS দিয়ে লিংক থেকে ডিফল্ট আন্ডারলাইন সরানো