আমরা আমাদের প্রয়োজনীয়তা অনুযায়ী স্টাইল লিঙ্ক করতে পারেন. এটি সুপারিশ করা হয় যে লিঙ্কগুলির শৈলী রয়েছে যা তাদের সাধারণ পাঠ্য থেকে আলাদা করে। বিভিন্ন লিঙ্ক রাজ্যের জন্য ডিফল্ট লিঙ্ক শৈলী নিম্নরূপ -
| লিঙ্ক স্টেট | রঙ |
|---|---|
| সক্রিয় | #EE0000 |
| ফোকাস | #5E9ED6 বা উইন্ডোজ এবং ম্যাকের ক্ষেত্রে নীল আউটলাইনের অনুরূপ শেড, লিনাক্সের জন্য #F07746 রূপরেখা যখন পাঠ্যের রঙ একই থাকে |
| হোভার | #0000EE |
| লিঙ্ক | #0000EE |
| পরিদর্শন করেছেন | #551A8B |
দ্রষ্টব্য - উপরের রঙগুলি ব্রাউজারগুলির নতুন সংস্করণগুলির সাথে পরিবর্তিত হতে পারে৷ সঠিক কার্যকারিতার জন্য, ছদ্ম নির্বাচকদের ক্রম এর দ্বারা দেওয়া হয়:- :link, :visited, :hover, :active.
উদাহরণ
নিম্নলিখিত উদাহরণগুলি স্ট্যান্ডার্ড লিঙ্ক শৈলীগুলিকে চিত্রিত করে
<!DOCTYPE html>
<html>
<head>
<style>
* {
text-align: center;
}
</style>
</head>
<body>
<h2>Learn JDBC</h2>
<a href="">Click here</a>
<br/><br/>
<a href="#">And here <img src="https://www.tutorialspoint.com/jdbc/images/jdbc-mini-logo.jpg"></a>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
লিঙ্কের সক্রিয় অবস্থা নিম্নলিখিত আউটপুটে −
দেখানো হয়েছে
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#one {
color: black;
text-decoration: none;
}
#two {
font-style: italic;
box-shadow: inset 0 0 8px coral;
}
table, td {
font-size: 1.4em;
padding: 8px;
text-align: center;
border: thin solid;
}
</style>
</head>
<body>
<table>
<tr>
<td><a id="one" href="#">1</a>(non standard link)</td>
<td id="two"><a href="#">2</a></td>
</tr>
<tr>
<td><a href="">3</a></td>
<td><a href="#">4</a></td>
</tr>
</table>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট দেয় -
আমরা "2" ক্লিক করার সাথে সাথে আমরা নিম্নলিখিত আউটপুট পাব
