Jassif Team Institution

এইচটিএমএল লিঙ্ক রং

একটি HTML লিঙ্ক পরিদর্শন করা, দেখা না করা বা সক্রিয় কিনা তার উপর নির্ভর করে একটি ভিন্ন রঙে প্রদর্শিত হয়।

ডিফল্টরূপে, একটি লিঙ্ক নিম্নরূপ প্রদর্শিত হবে (সমস্ত ব্রাউজারে):

লিঙ্ক রং পরিবর্তন

লিঙ্কের রং CSS সিউডো-ক্লাস ব্যবহার করে কাস্টমাইজ করা যেতে পারে:

• a:link- দেখা না করা লিঙ্কগুলির জন্য
• a:visited- পরিদর্শন লিঙ্কের জন্য
• a:hover- যখন মাউস চলে যায়
• a:active- ক্লিক করলে

উদাহরণ

এখানে, একটি আনভিজিটেড লিঙ্ক একটি আন্ডারলাইন ছাড়া সবুজ। একটি পরিদর্শন লিঙ্ক একটি আন্ডারলাইন ছাড়া গোলাপী হয়. একটি সক্রিয় লিঙ্ক হলুদ এবং আন্ডারলাইন করা হয়। অতিরিক্তভাবে, যখন মাউস একটি লিঙ্কের উপর সরানো হয় (a:hover) এটি লাল হয়ে যায় এবং আন্ডারলাইন হয়:

<style>
a:link {
  color: green;
  background-color: transparent;
  text-decoration: none;
}

a:visited {
  color: pink;
  background-color: transparent;
  text-decoration: none;
}

a:hover {
  color: red;
  background-color: transparent;
  text-decoration: underline;
}

a:active {
  color: yellow;
  background-color: transparent;
  text-decoration: underline;
}
</style>

সংযোগ বোতাম

একটি লিঙ্ক সিএসএস ব্যবহার করে একটি বোতাম হিসাবে স্টাইল করা যেতে পারে:

উদাহরণ

<style>
a:link, a:visited {
  background-color: #f44336;
  color: white;
  padding: 15px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}

a:hover, a:active {
  background-color: red;
}
</style>

<a href="#">This is a link</a>

উন্নত উদাহরণ

a.button {
  border-radius: 25px;
  padding: 12px 30px;
}

a.button {
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

a.button {
  transition: all 0.3s ease;
}

a.button:hover {
  transform: translateY(-2px);
}

HTML লিঙ্ক ট্যাগ

অনুশীলন করুন

এটা কি সত্য বা মিথ্যা যে সমস্ত হাইপারলিঙ্ক ডিফল্টরূপে আন্ডারলাইন করা হয়?

সর্বোত্তম অনুশীলন