Tag Archives: Link

ডেটা কমিউনিকেশন ও কম্পিউটার নেটওয়ার্ক

ডেটা কমিউনিকেশন ও কম্পিউটার নেটওয়ার্ক : ডাটা লিঙ্ক লেয়ার : ভূমিকা (DCN – Data-link Layer Introduction)

Leave a comment

Huge Sell on Popular Electronics

Subscribe to Our Youtube Channel --|--Our Online Shop:ShopForSoul--|Get Trained in AI, Big-Data, Data Science--

রিদওয়ান বিন শামীম

 

ডাটা লিঙ্ক লেয়ার ওসিআই মডেলের দ্বিতীয় লেয়ার। এই লেয়ার জটিল লেয়ারগুলোর মধ্যে একটি, এর কিছু জটিল ফাংশনালিটি ও দায়িত্বও আছে।এটি হার্ডওয়ারগত তথ্য গোপন করে উপরের লেয়ারে যোগাযোগের মাধ্যম হিসেবে উপস্থাপন করে।

ডাটা লিঙ্ক লেয়ার এমন দুটি হোষ্টের মাঝে কাজ করে যারা কিছ কিছু ক্ষেত্রে সরাসরি সম্পৃক্ত, এই সরাসরি সম্পৃক্ততা দুটি পয়েন্টের মধ্যে বা সম্প্রচারগতও হতে পারে। ব্রডকাস্ট নেটওয়ার্কের সিস্টেম একই লিঙ্কে থাকে। ডাটা লিঙ্ক লেয়ারের কাজ আরও জটিল হয়ে যায় যখন একক সংঘর্ষ ডোমেইনে সেটিকে অনেকগুলো হোষ্ট নিয়ে কাজ করতে হয়।

ডাটা স্ট্রিমকে বাইট বাই বাইট সিগন্যালে রূপান্তরিত করা ও তাকে সংশ্লিষ্ট হার্ডওয়ারে প্রেরণের দায়িত্বও ডাটা লিঙ্ক লেয়ারের। রিসিভিং এন্ডে ডাটা লিঙ্ক লেয়ার হার্ডওয়ার থেকে ডাটা নিয়ে ফ্রেম ফরমেটে রূপ দিয়ে ঊর্ধ্বতন লেয়ারে প্রেরণ করে। ডাটা লিঙ্ক লেয়ারের দুটি সাব লেয়ার আছে,

  • লজিকাল লিঙ্ক কন্ট্রোলঃ এটি প্রটোকল, ফ্লো কন্ট্রোল ও এরর কন্ট্রোল নিয়ে কাজ করে।
  • মিডিয়া এক্সেস কন্ট্রোলঃ এটি মাধ্যমের প্রকৃত কন্ট্রোল নিয়ে কাজ করে।

 

ডাটা লিঙ্ক লেয়ারের কিছু ফাংশনালিটি আছে, এগুলো হল,

  • ফ্রেমিংঃ ডাটা লিঙ্ক লেয়ার নেটওয়ার্ক লেয়ার থেকে ডাটা প্যাকেট নিয়ে ফ্রেমে প্রক্রিয়াজাত করে।
  • এড্রেসিংঃ ডাটা লিঙ্ক লেয়ার লেয়ার-২ হার্ডওয়ার এড্রেসিং মেকানিজম প্রবর্তন করে।
  • সিনক্রোনাইজেশনঃ যখন ডাটা ফ্রেমকে লিঙ্কে পাঠানো হয় তখন উভয় যন্ত্রকে সমন্বিত হতে হয়।
  • এরর কন্ট্রোলঃ এটি সিগন্যাল সংক্রান্ত ভুল নিয়ন্ত্রণে কার্যকর।
  • ফ্লো কন্ট্রোলঃ দুটি যন্ত্রের ট্রান্সফারের গতি যেন এক হয় তা নিয়ন্ত্রণে ডাটা লিঙ্ক লেয়ার এটি ব্যবহার করে।
  • মাল্টি এক্সেসঃ মাল্টিপল সিস্টেমে সংঘর্ষ ছাড়া শেয়ারড মিডিয়া ব্যবহারের জন্য এই ফাংশনালিটি প্রয়োজন হয়।

 

এইচটিএমএল HTML

এইচটিএমএল লিঙ্ক (HTML Link)

Huge Sell on Popular Electronics

Subscribe to Our Youtube Channel --|--Our Online Shop:ShopForSoul--|Get Trained in AI, Big-Data, Data Science--

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

স্বর্ণা আখতার

সম্পাদনাঃ মোঃ রফিকুল ইসলাম

 

প্রায় সকল ওয়েবপেজ এ লিঙ্ক রয়েছে। লিঙ্ক এ ক্লিক করার মাধ্যমে ব্যবহারকারী এক পেজ থেকে অন্য পেজে যেতে পারে।

এইচটিএমএল লিঙ্ক - হাইপারলিঙ্ক

হাইপারলিঙ্ক হচ্ছে একটি Text, বা ছবি যার উপর ক্লিক করার মাধ্যমে আপনি অন্য আরেকটি ওয়েবপেজে/ডকুমেন্ড এ চলে যেতে পারে।

 

এইচটিএমএল লিঙ্ক - সিনট্যাক্স

এইচ টি এম এল এ লিঙ্ক সিনট্যাক্সগুলো কিভাবে গঠিত হয় নিচে তাঁর উদাহরন তুলে ধরা হল, <a> ট্যাগ দ্বারা লিঙ্ককে সঙ্গায়িত করা হয়।

লিঙ্ক সিনট্যাক্স

<a href="url">link text</a>

উদাহরনঃ

<a href="http://bangla.salearningschool.com/html/">Visit our HTML tutorial</a>

 

ফলাফলঃ

Visit our HTML tutorial

এখানে href অ্যাট্রিবিউট ওয়েব পেজ এর গন্তব্যকে নির্দেশ করে করে যেমন, http://bangla.salearningschool.com/html/
আর link text (Visit our HTML tutorial) হল প্রদর্শিত অংশ যার উপর ক্লিক করলে আপনি একটি নির্দিষ্ট ওয়েব পেজ এ স্থানান্তিরিত হবেন।

নেটঃ link text সবসময়ই টেক্স হতে হবে এমন কোন কথা নেই, এটি ছবি বা এইচটিএমএল এর যেকোন উপাদান হতে পারে।

 

লোকাল লিঙ্ক

উপরের উদাহরণে একটি সংয়সম্পূর্ণ ওয়েব এড্রেস (URL) ব্যবহার করা হয়েছে।

একটি লোকাল লিঙ্ক (একই ওয়েব সাইটের লিঙ্ক) নির্দিষ্ট করা হয় আপেক্ষিক URL এর সাহায্যে (http://www.... ব্যতীত)

যেমনঃ

<a href="html_images.asp">HTML Images</a>

 

এইচটিএমএল লিঙ্ক - কালার এবং আইকন

আপনি যখন কোন লিঙ্ক এর উপর নিয়ে যান তখন সাধারণত দুপ্রকার ঘটনা ঘটতে পারেঃ

১. মাউস এর তীর টিহ্নটি একটা ছোট হাতের রুপ নিতে পারে।
২. লিঙ্ক এর বিষয়বস্তু যেমন লিঙ্ক টেক্সট ইত্যাদির কালার পরিবর্তন হয়ে থাকে।

সাধারনত লিঙ্কগুলো যে কোন ব্রাউজার এ নিম্নোক্তভাবে দেখা যায়

১. অদেখা লিঙ্কগুলোর নিচে আন্ডার লাইন এবং এদের কালার নীল হয়।
২. দেখা লিঙ্কগুলোর নিচেও আন্ডার লাইন থাকে কিন্তু এদের কালার সাধারনত রক্তবর্ণ হয়।
৩. একটা সচল লিঙ্কএর নিচেও একইভাবে আন্ডার লাইন কিন্তু লাল কালারের হয়ে থাকে।

আপনি style ব্যবহার করে ডিফল্ট কালার ও আন্ডারলাইন পরিবর্তন করতে পারেন।

উদাহরণঃ

<style>
a:link    {color:#000000; background-color:transparent; text-decoration:none}
a:visited {color:#000000; background-color:transparent; text-decoration:none}
a:hover   {color:#ff0000; background-color:transparent; text-decoration:underline}
a:active  {color:#ff0000; background-color:transparent; text-decoration:underline}
</style>

এইচটিএমএল লিঙ্ক - টার্গেট অ্যাট্রিবিউট

target অ্যাট্রিবউট নির্দারণ করে ডকুমেন্টটি কোথায় খুলবে।

উদাহরণস্বরূপ ডকুমেন্টটি একই উইন্ডোতে খুলতে পারে বা নতুন ট্যাব এও খুলতে পারেঃ

<a href="http://bangla.salearningschool.com/html/" target="_blank">Visit our HTML tutorial</a>

 

ফলাফল

Visit our HTML tutorial

 

Target Value বিবরণ
_blank লিঙ্ককৃত ডকুমেন্টটি নতুন একটি উইন্ডো বা ট্যাব এ খোলে
_self লিঙ্ককৃত ডকুমেন্টটি যে ফ্রেমে ক্লিক করেছেন সেই একই ফ্রেমে খুলবে (এটিই ডিফল্ট হিসেবে থাকে)
_parent লিঙ্ককৃত ডকুমেন্টটি মুল ফ্রেমে খোলে
_top লিঙ্ককৃতডকুমেন্টটি সম্পূর্ণ উইন্ডো জুড়ে খোলে
framename লিঙ্ককৃত ডকুমেন্টটি নির্দিষ্ট নামের ফ্রেমে খোলে

 

আপনার ওয়েব পেজটি যদি একটি ফ্রেম লক করা থাকে, তাহলে target="_top" ব্যহার করে লক ভেঙ্গে ফেলতে পারেন।

উদাহরণঃ

<a href="http://bangla.salearningschool.com/html/" target="_top">Visit our HTML tutorial</a>

 

ফলাফলঃ

Visit our HTML tutorial

 

এইচটিএমএল লিঙ্ক - ইমেজ/ছবি লিঙ্ক হিসেবে ব্যবহার

ইমেজকে লিঙ্ক হিসেবে ব্যবহার করা খুবই সাধারণ

উদাহরণঃ

<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0">
</a>

 

ফলাফলঃ

smiley

 

এইচটিএমএল লিঙ্ক - id অ্যাট্রিবিউট

<a> এলিমেন্ট এর সাথে একটি id অ্যাট্রিবউট যোগ করুন

<a id="tips">Useful Tips Section</a>

 

<a> এলিমেন্ট এ একটি লিঙ্ক সংযুক্তকরণ

<a href="#tips">Visit the Useful Tips Section</a>

 

<a> এলিমেন্ট এ অন্য পেজ এর একটি লিঙ্ক যুক্তকরণ

<a href="http://bangla.salearningschool.com/html_links.htm#tips">Visit the Useful Tips Section</a>

 

 

সারসংক্ষেপ

• এইচটিএমএল <a> এলিমেন্ট এর ব্যবহার লিঙ্ককে সঙ্গালিত করে

• এইচটিএমএল href অ্যাট্রিবউট এর ব্যবহার লিঙ্ক এর এড্রেসকে সঙ্গায়িত করে

• এইচটিএমএল target অ্যাট্রিবউট এর ব্যবহার  লিঙ্কটি কোথায় খুলবে তা বোঝায়

• এইচটিএমএল <img> এলিমেন্ট এর ব্যবহার ইমেজ/ছবিকে লিঙ্ক সিহেবে ব্যবহার করে

• এইচটিএমএল id অ্যাট্রিবউট (id="value") এর ব্যবহার বুকমার্ক ডিফাইন করার জন্য ব্যবহৃত হয়

• এইচটিএমএল href অ্যাট্রিবউট (href="#value") এর ব্যবহার বুকমার্ক এ ঠিকানা বুঝায়

 

সি এস এস টিউটোরিয়াল (css tutorial)

সি এস এস লিঙ্ক (CSS Links)

Huge Sell on Popular Electronics

Subscribe to Our Youtube Channel --|--Our Online Shop:ShopForSoul--|Get Trained in AI, Big-Data, Data Science--

স্টাইলিং লিঙ্ক

সিএসএস প্রোপার্টি দ্বারা লিঙ্ক স্টাইল করা যেতে পারে (যেমন: color, font-family, background, ইত্যাদি)

a {
    color: #FF0000;
}

 

লিঙ্ক এর অবস্থা অনুসারে একে স্টাইল করা যেতে পারে।

লিঙ্ক এর চারটি অবস্থা রয়েছে:

  • a:link - সাধারণ, ভিজিট করা হয়নি এমন লিঙ্ক
  • a:visited - যে লিঙ্ক এ ভিজিটর ভিজিট করেছেন
  • a:hover - যে লিঙ্ক এর উপর ব্যবহারকারী মাউস রেখেছেন
  • a:active - ক্লিক করার মূহুর্তে লিঙ্ক এর অবস্থা

উদাহরণঃ

/* unvisited link */
a:link {
    color: #FF0000;
}

/* visited link */
a:visited {
    color: #00FF00;
}

/* mouse over link */
a:hover {
    color: #FF00FF;
}

/* selected link */
a:active {
    color: #0000FF;
}

 

লিঙ্ক এর বিভিন্ন অবস্থা স্টাইল করার ক্ষেত্রে ক্রমের কিছু নিয়ম রয়েছে:

  • a:hover অবশ্যই a:link এবং a:visited এর পরে আসতে হবে
  • a:active অবশ্যিই a:hover এর পরে আসতে হবে

 

প্রচলিত লিঙ্ক স্টাইল

উপরের উদাহরণে লিঙ্ক এর রঙ লিঙ্ক এর অবস্থার উপর ভিত্তি করে পরিবর্তিত হয়।

লিঙ্ক স্টাইল করার ক্ষেত্রে অন্যান্য প্রচলিত পন্থাগুলো দেখা যাক:

 

টেক্সট ডাইরেকশন

text-decoration প্রোপার্টি বেশিরভাগ ক্ষেত্রে লিঙ্ক এর আন্ডারলাইন মুছে ফেলতে ব্যবহার করা হয়:

a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:active {
    text-decoration: underline;
}

 

ব্যাকগ্রাউন্ড রঙ

background-color প্রোপার্টি ব্যাকগ্রাউন্ড এর এর রঙ নির্ধারণ করতে ব্যবহৃত হয়:

a:link {
    background-color: #B2FF99;
}

a:visited {
    background-color: #FFFF85;
}

a:hover {
    background-color: #FF704D;
}

a:active {
    background-color: #FF704D;
}

 

নিজে নিজে চেষ্টা করুন

অনুশীলন ০১ঃ

লিঙ্ক এর রঙ সবুজ হিসেবে নির্ধারণ করুন

<!DOCTYPE html>
<html>
<head>
<style>

</style>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p><a href="http://www.w3schools.com">W3Schools.com</a></p>

</body>
</html>

 

অনুশীলন ০২ঃ

ভিজিট করা হয়নি এমন অবস্থায় লিঙ্ক এর রঙ লাল এবং ভিজিট করার পর লিঙ্ক এর রঙ নীল হিসেবে নির্ধারণ করুন।

<!DOCTYPE html>
<html>
<head>
<style>
/* mouse over link */
a:hover {
    color: black;
}

/* selected link */
a:active {
    color: green;
}
</style>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p><a href="http://www.w3schools.com">W3Schools.com</a></p>

</body>
</html>

 

অনুলীলন ০৩ঃ

hover এবং active লিঙ্ক অবস্থার ক্ষেত্রে ভিজিটেড এবং আনভিজিটেড লিঙ্ক হতে আন্ডারলাইন মুছে দিন

<!DOCTYPE html>
<html>
<head>
<style>
/* unvisited link */
a:link {
    
}

/* visited link */
a:visited {
    
}

/* mouse over link */
a:hover {
    
}

/* selected link */
a:active {
    
}
</style>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p><a href="http://www.w3schools.com">W3Schools.com</a></p>

</body>
</html>

 

অনুশীলন ০৪ঃ

ভিজিটেড এবং আনভিজিটেড লিঙ্ক এর জন্য ব্যাকগ্রাউন্ড রঙ "lightblue" নির্ধারণ করুন এবং hover এবং active লিঙ্ক অবস্থার ক্ষেত্রে ব্যাকগ্রাউন্ড রঙ হলুদ হিসেবে নির্ধারণ করুন

<!DOCTYPE html>
<html>
<head>
<style>
/* unvisited link */
a:link {
    
}

/* visited link */
a:visited {
    
}

/* mouse over link */
a:hover {
    
}

/* selected link */
a:active {
    
}
</style>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p><a href="http://www.w3schools.com">W3Schools.com</a></p>

</body>
</html>