CSS හි සබැඳි තත්වයන්
ඔබ අන්තර්ජාලයේ විවිධ වෙබ් අඩවි පිරික්සන විට, සබැඳි සාමාන්යයෙන් මූසික කරුවකු ඒවා මත ගෙන යන විට ප්රතිචාර දක්වන බව ඔබ සැලකිල්ලට ගෙන ඇතැයි මම හිතමි. සබැඳිවල විවිධ තත්වයන් සඳහා හැසිරීම නියම කිරීමෙන් එවැනි බලපෑමක් ලබා ගත හැකිය.
උදාහරණයක් ලෙස, මෙය - a:hover - සබැඳියක් මත මූසික කරුවා ගෙන යන විට අපි තත්වය අල්ලා ගනිමු. මෙම මොහොතේදී, අපට උදාහරණයක් ලෙස, සබැඳියේ වර්ණය වෙනස් කිරීමට හෝ යටින් ඉරි ඇඳීම ඉවත් කිරීමට/එකතු කිරීමට හැකිය. :hover ඉදිකිරීම්ව සුළු වර්ගය ලෙස හඳුන්වයි. සුළු වර්ග මූලද්රව්යවල විවිධ තත්වයන් අල්ලා ගැනීමට ඉඩ සලසයි.
:hover හැර, :link සුළු වර්ග ද ඇත, ඒවා නොපිරික්සූ සබැඳිය අල්ලා ගනී, සහ :visited, ඒවා පිරික්සූ සබැඳිය අල්ලා ගනී. සමහර වෙබ් අඩවිවල, පරිශීලකයින්ට ඔවුන් කොහෙද, කොහේ නැද්ද යන්න පෙන්වීමට ඒවා භාවිතා කරයි. :active සුළු වර්ගය ද ඇත, එය පහත තත්වය අල්ලා ගනී: මූසිකයෙන් මූලද්රව්යයක් මත ක්ලික් කර ඇත, නමුත් තවම මුදා හරිනු නොලැබේ.
පහත උදාහරණයේ, :hover තත්වයේ ඇති සබැඳියක් සඳහා යටින් ඉරි ඇඳීම ඉවත් කරනු ලැබේ, :link තත්වය සඳහා රතු වර්ණයක් නියම කරනු ලැබේ, :visited තත්වය සඳහා - හරිත, :active තත්වය සඳහා - නිල්. ප්රතිඵලය වන්නේ, ආරම්භයේදී සබැඳිය රතු වර්ණයේ වනු ඇත, එය මත ක්ලික් කිරීමෙන් පසු - හරිත, එය මත මූසිකයෙන් ක්ලික් කර අතහරින්නේ නම් - නිල්, සහ මූසිකය ගෙනයන්නේ නම් - යටින් ඉරි ඇඳ නොමැති වනු ඇත:
a:link {
color: red;
}
a:visited {
color: green;
}
a:hover {
text-decoration: none;
}
a:active {
color: blue;
}
<a href="#">link</a>
:
