HTML-এ, আপনি অন্যান্য নথির লিঙ্ক তৈরি করতে পারেন, সেগুলি ওয়েব পৃষ্ঠা, ছবি, স্টাইলশীট, স্ক্রিপ্ট বা অন্যান্য ধরনের ফাইলই হোক না কেন। লিঙ্ক তৈরির জন্য সবচেয়ে বেশি ব্যবহৃত HTML উপাদান হল <a> উপাদান, যার অর্থ "অ্যাঙ্কর"।
কিভাবে অন্য ওয়েব পৃষ্ঠায় একটি মৌলিক লিঙ্ক তৈরি করতে হয় তার একটি উদাহরণ এখানে দেওয়া হলঃ-
<a href="https://www.example.com">Link Text</a>
এই উদাহরণে, <a> উপাদানটি লক্ষ্য ওয়েব পৃষ্ঠার URL নির্দিষ্ট করে href বৈশিষ্ট্যের সাথে একটি লিঙ্ক তৈরি করতে ব্যবহৃত হয় (এই ক্ষেত্রে, "https://www.example.com") টেক্সট "লিঙ্ক টেক্সট" হল লিঙ্কের দৃশ্যমান পাঠ্য যা ব্যবহারকারীরা লক্ষ্য ওয়েব পৃষ্ঠায় নেভিগেট করতে ক্লিক করতে পারেন।
আপনি href অ্যাট্রিবিউটে উপযুক্ত ফাইল পাথ বা URL সহ <a> উপাদান ব্যবহার করে অন্যান্য ধরনের ফাইলের লিঙ্কও তৈরি করতে পারেন, যেমন ছবি, স্টাইলশীট বা স্ক্রিপ্ট। উদাহরণ স্বরূপঃ-
<!-- Link to an image file --> <a href="images/image.jpg">Image Link</a> <!-- Link to a CSS stylesheet --> <a href="styles/styles.css" rel="stylesheet" type="text/css">Stylesheet Link</a> <!-- Link to a JavaScript file --> <a href="scripts/script.js" type="text/javascript">Script Link</a>
এই উদাহরণগুলিতে, <a> উপাদানটি যথাক্রমে একটি চিত্র ফাইল, একটি CSS স্টাইলশীট এবং একটি জাভাস্ক্রিপ্ট ফাইলের লিঙ্ক তৈরি করতে ব্যবহৃত হয়।
আপনি href অ্যাট্রিবিউটে উপযুক্ত ফাইল পাথ বা URL সহ <a> উপাদান ব্যবহার করে PDF, Word নথি বা অন্যান্য ফাইলের প্রকারের মতো অন্যান্য ধরনের নথির লিঙ্কও তৈরি করতে পারেন।
যাইহোক, এটি লক্ষ করা গুরুত্বপূর্ণ যে বিভিন্ন ধরনের ফাইলের সাথে লিঙ্ক করার জন্য সার্ভার-সাইড বা ক্লায়েন্ট-সাইডে অতিরিক্ত হ্যান্ডলিং প্রয়োজন হতে পারে যাতে ফাইলগুলি দেখার বা ডাউনলোড করার জন্য উপযুক্ত সফ্টওয়্যার বা অ্যাপ্লিকেশন দ্বারা সঠিকভাবে পরিচালনা করা হয়।
The Target Attributes:
HTML-এ, টার্গেট অ্যাট্রিবিউটটি <a> (অ্যাঙ্কর) উপাদানের সাথে ব্যবহার করা হয় যাতে ক্লিক করা হলে লিঙ্ক করা নথিটি কোথায় প্রদর্শিত হবে। টার্গেট অ্যাট্রিবিউট লিঙ্কের আচরণ নিয়ন্ত্রণ করতে বিভিন্ন মান নিতে পারে, যেমন একটি নতুন উইন্ডোতে, একটি নতুন ট্যাবে বা একই উইন্ডো/ট্যাবে লিঙ্ক করা নথি খোলা।
টার্গেট অ্যাট্রিবিউটের জন্য এখানে কিছু সাধারণ মান রয়েছেঃ-
1. _blank: লিঙ্ক করা নথিটি একটি নতুন ব্রাউজার উইন্ডো বা ট্যাবে খোলে।
<a href="https://www.example.com" target="_blank">Link Text</a>
The Target Attributes:
HTML-এ, টার্গেট অ্যাট্রিবিউটটি <a> (অ্যাঙ্কর) উপাদানের সাথে ব্যবহার করা হয় যাতে ক্লিক করা হলে লিঙ্ক করা নথিটি কোথায় প্রদর্শিত হবে। টার্গেট অ্যাট্রিবিউট লিঙ্কের আচরণ নিয়ন্ত্রণ করতে বিভিন্ন মান নিতে পারে, যেমন একটি নতুন উইন্ডোতে, একটি নতুন ট্যাবে বা একই উইন্ডো/ট্যাবে লিঙ্ক করা নথি খোলা।
টার্গেট অ্যাট্রিবিউটের জন্য এখানে কিছু সাধারণ মান রয়েছেঃ-
1. _blank: লিঙ্ক করা নথিটি একটি নতুন ব্রাউজার উইন্ডো বা ট্যাবে খোলে।
<a href="https://www.example.com" target="_blank">Link Text</a>
2. _self: লিঙ্ক করা নথিটি একই উইন্ডো/ট্যাবে খোলে যেখানে লিঙ্কটি ক্লিক করা হয়েছিল। টার্গেট অ্যাট্রিবিউট নির্দিষ্ট করা না থাকলে এটি ডিফল্ট আচরণ।
<a href="https://www.example.com" target="_blank">Link Text</a>
3. _parent: বর্তমান উইন্ডো বা ফ্রেমের প্যারেন্ট উইন্ডো বা ফ্রেমে লিঙ্ক করা ডকুমেন্ট খোলে, যদি বর্তমান উইন্ডো বা ফ্রেমের প্যারেন্ট থাকে।
<a href="https://www.example.com" target="_parent">Link Text</a>
4. _top: শীর্ষ-স্তরের ব্রাউজিং প্রসঙ্গে লিঙ্ক করা নথি খোলে, অন্য সব ফ্রেম বা উইন্ডো, যদি থাকে তাহলে বাতিল করে।
<a href="https://www.example.com" target="_top">Link Text</a>
5. <iframe> Name Attributes: আপনার যদি একটি নাম বৈশিষ্ট্য সহ একটি <iframe> উপাদান থাকে, তাহলে আপনি সেই নামটিকে লক্ষ্য বৈশিষ্ট্যের মান হিসাবে ব্যবহার করতে পারেন যাতে লিঙ্ক করা নথিটি সেই নির্দিষ্ট আইফ্রেমে লোড করা উচিত।
<iframe src="https://www.example.com" name="myframe"></iframe> <a href="https://www.example.com" target="myframe">Link Text</iframe> a>
এটা মনে রাখা গুরুত্বপূর্ণ যে টার্গেট অ্যাট্রিবিউটের ব্যবহার এবং নতুন উইন্ডো বা ট্যাবে খোলার লিঙ্ক ব্যবহারকারীর অভিজ্ঞতাকে প্রভাবিত করতে পারে এবং ব্যবহারযোগ্যতা এবং অ্যাক্সেসযোগ্যতার দৃষ্টিকোণ থেকে সবসময় সুপারিশ করা নাও হতে পারে।
টার্গেট অ্যাট্রিবিউটটি যথাযথভাবে ব্যবহার করা এবং ক্লিক করার সময় লিঙ্কগুলি কীভাবে আচরণ করা উচিত তা নির্ধারণ করার সময় আপনার ব্যবহারকারীদের চাহিদা এবং আপনার ওয়েবসাইটের প্রসঙ্গ বিবেচনা করা ভাল।
Use of Base Path:
<base> উপাদান হল একটি HTML ট্যাগ যা একটি ওয়েব পৃষ্ঠার মধ্যে সমস্ত আপেক্ষিক URL-এর জন্য একটি বেস URL নির্দিষ্ট করতে ব্যবহৃত হয়।
Use of Base Path:
<base> উপাদান হল একটি HTML ট্যাগ যা একটি ওয়েব পৃষ্ঠার মধ্যে সমস্ত আপেক্ষিক URL-এর জন্য একটি বেস URL নির্দিষ্ট করতে ব্যবহৃত হয়।
এটি সাধারণত একটি HTML নথির <head> বিভাগের মধ্যে স্থাপন করা হয় এবং বেস ইউআরএল সংজ্ঞায়িত করতে ব্যবহৃত হয় যা লিঙ্ক, ছবি, স্ক্রিপ্ট এবং স্টাইলশীট সহ সমস্ত সংস্থানগুলির আপেক্ষিক URLগুলি সমাধান করার জন্য রেফারেন্স পয়েন্ট হিসাবে ব্যবহার করা উচিত। নথি
<base> উপাদানের href এট্রিবিউট বেস ইউআরএল নির্দিষ্ট করে, যা আপেক্ষিক ইউআরএল সমাধানের জন্য রেফারেন্স পয়েন্ট হিসাবে ব্যবহৃত হয়। নথির মধ্যে থাকা সমস্ত আপেক্ষিক ইউআরএল, যেমন <a href>, <img src>, <link href>, <script src>, ইত্যাদি, এই বেস ইউআরএলের সাপেক্ষে সমাধান করা হবে।
এখানে কিভাবে <base> উপাদান ব্যবহার করা যেতে পারে তার একটি উদাহরণঃ-
<html> <head> <base href="https://www.example.com/base/"> <title>HTML Base Example</title> <link rel="stylesheet" href="styles.css"> <script src="script.js"></script> </head> <body> <h1>Hello, world!</h1> <a href="about.html">About Us</a> <img src="images/logo.png" alt="Logo"> </body> </html>
এই উদাহরণে, <base> উপাদানটি বেস URL নির্দিষ্ট করতে ব্যবহৃত হয়।
এইচটিএমএল-এ, আপনি <a> (অ্যাঙ্কর) উপাদান এবং একটি URL এর সাথে href বৈশিষ্ট্য ব্যবহার করে একটি ওয়েব পৃষ্ঠার মধ্যে একটি নির্দিষ্ট বিভাগ বা অ্যাঙ্করের সাথে লিঙ্ক করতে পারেন যাতে লক্ষ্য বিভাগ বা অ্যাঙ্করের আইডি অন্তর্ভুক্ত থাকে।
আপনি কীভাবে একটি ওয়েব পৃষ্ঠার মধ্যে একটি নির্দিষ্ট বিভাগে একটি লিঙ্ক তৈরি করতে পারেন তার একটি উদাহরণ এখানে দেওয়া হলঃ-
<html> <head> <title>Link to Page Section Example</title> </head> <body> <h1>Page Heading</h1> <ul> <li><a href="#section1">Section 1</a></li> <li><a href="#section2">Section 2</a></li> <li><a href="#section3">Section 3</a></li> </ul> <h2 id="section1">Section 1</h2> <p>This is the content of section 1.</p> <h2 id="section2">Section 2</h2> <p>This is the content of section 2.</p> <h2 id="section3">Section 3</h2> <p>This is the content of section 3.</p> </body> </html>
এই উদাহরণে, শিরোনাম এবং অনুচ্ছেদ সহ তিনটি বিভাগ রয়েছে। <ul> এলিমেন্টের মধ্যে থাকা <a> উপাদানগুলো URL এর সাথে href এট্রিবিউট ব্যবহার করে এই বিভাগগুলির লিঙ্ক তৈরি করে যাতে টার্গেট বিভাগের আইডি অন্তর্ভুক্ত থাকে।
<html> <head> <title>Link Color Example</title> <style> /* Define the link color using CSS */ a { color: blue; } /* Define the visited link color */ a:visited { color: purple; } /* Define the hover link color */ a:hover { color: red; } /* Define the active link color */ a:active { color: green; } </style> </head> <body> <h1>Link Color Example</h1> <p>This is a <a href="https://www.example.com">link</a>.</p> </body> </html>
এই উদাহরণে, <style> উপাদানটি <a> উপাদানের জন্য CSS নিয়ম নির্ধারণ করতে ব্যবহৃত হয়, যা লিঙ্ক তৈরি করতে ব্যবহৃত হয়। রঙের বৈশিষ্ট্য লিঙ্কের রঙ নির্দিষ্ট করতে ব্যবহৃত হয়। এই ক্ষেত্রে, লিঙ্ক রঙ নীল সেট করা হয়।
Download Links:
HTML এ, আপনি ব্যবহারকারীদের আপনার ওয়েবসাইট থেকে ফাইল ডাউনলোড করার ক্ষমতা প্রদান করতে ডাউনলোড লিঙ্ক তৈরি করতে পারেন। আপনি ব্যবহার করতে পারেন <a> সঙ্গে উপাদানডাউনলোড ডাউনলোড লিঙ্ক তৈরি করার বৈশিষ্ট্য। এখানে একটি উদাহরণঃ-
<html> <head> <title>Download Link Example</title> </head> <body> <h1>Download Link Example</h1> <p>Click the link below to download a file:</p> <a href="/path/to/file.pdf" download>Download PDF</a> </body> </html>
এই উদাহরণে,<a> উপাদান একটি PDF ফাইলের জন্য একটি ডাউনলোড লিঙ্ক তৈরি করতে ব্যবহৃত হয়। দ্যhref attribute সার্ভারে ফাইলের পাথ নির্দিষ্ট করে। Download এট্রিবিউট ব্যবহার করা হয় নির্দেশ করার জন্য যে লিঙ্কটি লিঙ্ক করা ফাইলটি নেভিগেট করার পরিবর্তে ডাউনলোড করবে।
<html> <head> <title>File Download Dialog Box Example</title> <script> function downloadFile() { var url = '/path/to/file.pdf'; // URL of the file to be downloaded var fileName = 'my_document.pdf'; // File name for the downloaded file var link = document.createElement('a'); link.href = url; link.download = fileName; document.body.appendChild(link); link.click(); document.body.removeChild(link); delete link; } </script> </head> <body> <h1>File Download Dialog Box Example</h1> <p>Click the button below to download a file:</p> <button onclick="downloadFile()">Download PDF</button> </body> </html>
এই উদাহরণে, একটি জাভাস্ক্রিপ্ট ফাংশন বলা হয়ডাউনলোড ফাইল() সংজ্ঞায়িত করা হয়, যা একটি নতুন তৈরি করে <a> সঙ্গে উপাদান href ডাউনলোড করা ফাইলের URL-এ অ্যাট্রিবিউট সেট করুন এবংডাউনলোড ডাউনলোড করা ফাইলের জন্য পছন্দসই ফাইলের নামের সাথে বৈশিষ্ট্য সেট করুন।
The syntax for the <base> element is as follows:
<head>
<base href="base_url">
<!-- other meta tags, title, styles, scripts, etc. -->
</head>
<base> উপাদানের href এট্রিবিউট বেস ইউআরএল নির্দিষ্ট করে, যা আপেক্ষিক ইউআরএল সমাধানের জন্য রেফারেন্স পয়েন্ট হিসাবে ব্যবহৃত হয়। নথির মধ্যে থাকা সমস্ত আপেক্ষিক ইউআরএল, যেমন <a href>, <img src>, <link href>, <script src>, ইত্যাদি, এই বেস ইউআরএলের সাপেক্ষে সমাধান করা হবে।
এখানে কিভাবে <base> উপাদান ব্যবহার করা যেতে পারে তার একটি উদাহরণঃ-
<html> <head> <base href="https://www.example.com/base/"> <title>HTML Base Example</title> <link rel="stylesheet" href="styles.css"> <script src="script.js"></script> </head> <body> <h1>Hello, world!</h1> <a href="about.html">About Us</a> <img src="images/logo.png" alt="Logo"> </body> </html>
এই উদাহরণে, <base> উপাদানটি বেস URL নির্দিষ্ট করতে ব্যবহৃত হয়।
"https://www.example.com/base/" নথির মধ্যে আপেক্ষিক URL গুলি সমাধান করার জন্য৷ স্টাইলশীট "styles.css" এবং স্ক্রিপ্ট "script.js" এই বেস URL-এর সাপেক্ষে লোড করা হবে৷ একইভাবে, <a href> অ্যাট্রিবিউটে আপেক্ষিক URL "about.html" এবং <img src> অ্যাট্রিবিউটের আপেক্ষিক URL "images/logo.png" নির্দিষ্ট বেস ইউআরএলের সাপেক্ষে সমাধান করা হবে।
<base> উপাদানের ব্যবহার এমন পরিস্থিতিতে সহায়ক হতে পারে যেখানে আপনি একটি নথির মধ্যে সমস্ত আপেক্ষিক URL-এর জন্য একটি সাধারণ ভিত্তি URL সেট করতে চান, যাতে নথিটিকে বিভিন্ন স্থানে সরানো বা স্থাপন করার সময় URLগুলি পরিচালনা এবং আপডেট করা সহজ হয় ৷
<base> উপাদানের ব্যবহার এমন পরিস্থিতিতে সহায়ক হতে পারে যেখানে আপনি একটি নথির মধ্যে সমস্ত আপেক্ষিক URL-এর জন্য একটি সাধারণ ভিত্তি URL সেট করতে চান, যাতে নথিটিকে বিভিন্ন স্থানে সরানো বা স্থাপন করার সময় URLগুলি পরিচালনা এবং আপডেট করা সহজ হয় ৷
যাইহোক, <base> উপাদানটি যথাযথভাবে ব্যবহার করা এবং আপেক্ষিক URL রেজোলিউশনে এর সম্ভাব্য প্রভাব সম্পর্কে সচেতন হওয়া গুরুত্বপূর্ণ, কারণ এটি নথির মধ্যে সমস্ত আপেক্ষিক URL-এর আচরণকে প্রভাবিত করতে পারে।
Linking to a Page Section:
Linking to a Page Section:
এইচটিএমএল-এ, আপনি <a> (অ্যাঙ্কর) উপাদান এবং একটি URL এর সাথে href বৈশিষ্ট্য ব্যবহার করে একটি ওয়েব পৃষ্ঠার মধ্যে একটি নির্দিষ্ট বিভাগ বা অ্যাঙ্করের সাথে লিঙ্ক করতে পারেন যাতে লক্ষ্য বিভাগ বা অ্যাঙ্করের আইডি অন্তর্ভুক্ত থাকে।
আপনি কীভাবে একটি ওয়েব পৃষ্ঠার মধ্যে একটি নির্দিষ্ট বিভাগে একটি লিঙ্ক তৈরি করতে পারেন তার একটি উদাহরণ এখানে দেওয়া হলঃ-
<html> <head> <title>Link to Page Section Example</title> </head> <body> <h1>Page Heading</h1> <ul> <li><a href="#section1">Section 1</a></li> <li><a href="#section2">Section 2</a></li> <li><a href="#section3">Section 3</a></li> </ul> <h2 id="section1">Section 1</h2> <p>This is the content of section 1.</p> <h2 id="section2">Section 2</h2> <p>This is the content of section 2.</p> <h2 id="section3">Section 3</h2> <p>This is the content of section 3.</p> </body> </html>
এই উদাহরণে, শিরোনাম এবং অনুচ্ছেদ সহ তিনটি বিভাগ রয়েছে। <ul> এলিমেন্টের মধ্যে থাকা <a> উপাদানগুলো URL এর সাথে href এট্রিবিউট ব্যবহার করে এই বিভাগগুলির লিঙ্ক তৈরি করে যাতে টার্গেট বিভাগের আইডি অন্তর্ভুক্ত থাকে।
প্রতিটি বিভাগের জন্য <h2> উপাদানগুলিতে আইডি বৈশিষ্ট্য ব্যবহার করে আইডিগুলি সংজ্ঞায়িত করা হয়।
যখন একজন ব্যবহারকারী একটি লিঙ্কে ক্লিক করেন, ব্রাউজার স্বয়ংক্রিয়ভাবে পৃষ্ঠার মধ্যে লক্ষ্য বিভাগে স্ক্রোল করবে href বৈশিষ্ট্যে নির্দিষ্ট আইডির উপর ভিত্তি করে।
যখন একজন ব্যবহারকারী একটি লিঙ্কে ক্লিক করেন, ব্রাউজার স্বয়ংক্রিয়ভাবে পৃষ্ঠার মধ্যে লক্ষ্য বিভাগে স্ক্রোল করবে href বৈশিষ্ট্যে নির্দিষ্ট আইডির উপর ভিত্তি করে।
এটি আপনাকে একটি ওয়েব পৃষ্ঠার মধ্যে অভ্যন্তরীণ লিঙ্ক তৈরি করতে এবং ব্যবহারকারীদের পৃষ্ঠার মধ্যে নির্দিষ্ট বিভাগ বা অ্যাঙ্করগুলিতে নেভিগেট করার জন্য একটি সুবিধাজনক উপায় প্রদান করতে দেয়।
Setting Link Colors:
HTML-এ, আপনি CSS (ক্যাসকেডিং স্টাইল শীট) ব্যবহার করে লিঙ্কের রঙ সেট করতে পারেন। CSS আপনাকে রঙ, ফন্ট-সাইজ এবং পাঠ্য-সজ্জার মতো বিভিন্ন বৈশিষ্ট্য প্রয়োগ করে লিঙ্ক সহ HTML উপাদানগুলির উপস্থিতি স্টাইল করতে দেয়।
Setting Link Colors:
HTML-এ, আপনি CSS (ক্যাসকেডিং স্টাইল শীট) ব্যবহার করে লিঙ্কের রঙ সেট করতে পারেন। CSS আপনাকে রঙ, ফন্ট-সাইজ এবং পাঠ্য-সজ্জার মতো বিভিন্ন বৈশিষ্ট্য প্রয়োগ করে লিঙ্ক সহ HTML উপাদানগুলির উপস্থিতি স্টাইল করতে দেয়।
আপনি কিভাবে CSS ব্যবহার করে HTML এ লিঙ্কের রঙ সেট করতে পারেন তার একটি উদাহরণ এখানে দেওয়া হলঃ-
<html> <head> <title>Link Color Example</title> <style> /* Define the link color using CSS */ a { color: blue; } /* Define the visited link color */ a:visited { color: purple; } /* Define the hover link color */ a:hover { color: red; } /* Define the active link color */ a:active { color: green; } </style> </head> <body> <h1>Link Color Example</h1> <p>This is a <a href="https://www.example.com">link</a>.</p> </body> </html>
এই উদাহরণে, <style> উপাদানটি <a> উপাদানের জন্য CSS নিয়ম নির্ধারণ করতে ব্যবহৃত হয়, যা লিঙ্ক তৈরি করতে ব্যবহৃত হয়। রঙের বৈশিষ্ট্য লিঙ্কের রঙ নির্দিষ্ট করতে ব্যবহৃত হয়। এই ক্ষেত্রে, লিঙ্ক রঙ নীল সেট করা হয়।
অতিরিক্তভাবে, :visited, :hover, এবং :active pseudo-classগুলি পরিদর্শন করা লিঙ্কগুলির শৈলী সংজ্ঞায়িত করতে ব্যবহৃত হয়, মাউস কার্সার দ্বারা ঘোরাফেরা করা লিঙ্কগুলি এবং ক্লিক করা লিঙ্কগুলি যথাক্রমে।
আপনি CSS নিয়মে রঙের মানগুলিকে যেকোনো বৈধ CSS রঙের মানতে পরিবর্তন করতে পারেন, যেমন একটি নামযুক্ত রঙ (যেমন, নীল, লাল, সবুজ), একটি হেক্সাডেসিমেল RGB মান (যেমন, লালের জন্য #ff0000),
আপনি CSS নিয়মে রঙের মানগুলিকে যেকোনো বৈধ CSS রঙের মানতে পরিবর্তন করতে পারেন, যেমন একটি নামযুক্ত রঙ (যেমন, নীল, লাল, সবুজ), একটি হেক্সাডেসিমেল RGB মান (যেমন, লালের জন্য #ff0000),
একটি RGB বা RGBA মান (যেমন, লাল রঙের জন্য rgb(255, 0, 0)), অথবা একটি HSL বা HSLA মান (যেমন, hsl(0, 100%, 50%) লাল রঙের জন্য)। এটি আপনাকে আপনার ডিজাইনের প্রয়োজনীয়তা অনুসারে লিঙ্কের রঙ কাস্টমাইজ করতে দেয়।
Download Links:
HTML এ, আপনি ব্যবহারকারীদের আপনার ওয়েবসাইট থেকে ফাইল ডাউনলোড করার ক্ষমতা প্রদান করতে ডাউনলোড লিঙ্ক তৈরি করতে পারেন। আপনি ব্যবহার করতে পারেন <a> সঙ্গে উপাদানডাউনলোড ডাউনলোড লিঙ্ক তৈরি করার বৈশিষ্ট্য। এখানে একটি উদাহরণঃ-
<html> <head> <title>Download Link Example</title> </head> <body> <h1>Download Link Example</h1> <p>Click the link below to download a file:</p> <a href="/path/to/file.pdf" download>Download PDF</a> </body> </html>
এই উদাহরণে,<a> উপাদান একটি PDF ফাইলের জন্য একটি ডাউনলোড লিঙ্ক তৈরি করতে ব্যবহৃত হয়। দ্যhref attribute সার্ভারে ফাইলের পাথ নির্দিষ্ট করে। Download এট্রিবিউট ব্যবহার করা হয় নির্দেশ করার জন্য যে লিঙ্কটি লিঙ্ক করা ফাইলটি নেভিগেট করার পরিবর্তে ডাউনলোড করবে।
ব্যবহারকারী যখন লিঙ্কটিতে ক্লিক করেন, ব্রাউজার তাদের ফাইলটি ডাউনলোড করতে অনুরোধ করবে, তাদের স্থানীয় কম্পিউটারে এটি সংরক্ষণ করার অনুমতি দেবে।
আপনি ব্যবহার করতে পারেনডাউনলোড বিভিন্ন ধরনের ফাইলের সাথে বৈশিষ্ট্য, যেমন PDF, ছবি, অডিও ফাইল, ভিডিও ফাইল এবং অন্যান্য নথির ধরন।
আপনি ব্যবহার করতে পারেনডাউনলোড বিভিন্ন ধরনের ফাইলের সাথে বৈশিষ্ট্য, যেমন PDF, ছবি, অডিও ফাইল, ভিডিও ফাইল এবং অন্যান্য নথির ধরন।
এর মানডাউনলোড বৈশিষ্ট্য ঐচ্ছিক, এবং আপনি ফাইলটি ডাউনলোড করার সময় ব্যবহার করার জন্য একটি কাস্টম ফাইলের নাম উল্লেখ করতে পারেন, যেমনঃ-
<a href="/path/to/file.pdf" download="my_document.pdf">PDF Download</a>
এটি আপনাকে সার্ভার থেকে আসল ফাইলের নাম ব্যবহার করার পরিবর্তে ডাউনলোড করা ফাইলের জন্য একটি অর্থপূর্ণ নাম প্রদান করতে দেয়।
File Download Dialog Box:
HTML এ, আপনি শুধুমাত্র HTML মার্কআপ ব্যবহার করে সরাসরি একটি ফাইল ডাউনলোড ডায়ালগ বক্স তৈরি করতে পারবেন না। যাইহোক, আপনি HTML এর সাথে জাভাস্ক্রিপ্ট ব্যবহার করে একটি ফাইল ডাউনলোড ডায়ালগ বক্স ট্রিগার করতে পারেন। এখানে একটি উদাহরণঃ-
<a href="/path/to/file.pdf" download="my_document.pdf">PDF Download</a>
এটি আপনাকে সার্ভার থেকে আসল ফাইলের নাম ব্যবহার করার পরিবর্তে ডাউনলোড করা ফাইলের জন্য একটি অর্থপূর্ণ নাম প্রদান করতে দেয়।
File Download Dialog Box:
HTML এ, আপনি শুধুমাত্র HTML মার্কআপ ব্যবহার করে সরাসরি একটি ফাইল ডাউনলোড ডায়ালগ বক্স তৈরি করতে পারবেন না। যাইহোক, আপনি HTML এর সাথে জাভাস্ক্রিপ্ট ব্যবহার করে একটি ফাইল ডাউনলোড ডায়ালগ বক্স ট্রিগার করতে পারেন। এখানে একটি উদাহরণঃ-
<html> <head> <title>File Download Dialog Box Example</title> <script> function downloadFile() { var url = '/path/to/file.pdf'; // URL of the file to be downloaded var fileName = 'my_document.pdf'; // File name for the downloaded file var link = document.createElement('a'); link.href = url; link.download = fileName; document.body.appendChild(link); link.click(); document.body.removeChild(link); delete link; } </script> </head> <body> <h1>File Download Dialog Box Example</h1> <p>Click the button below to download a file:</p> <button onclick="downloadFile()">Download PDF</button> </body> </html>
এই উদাহরণে, একটি জাভাস্ক্রিপ্ট ফাংশন বলা হয়ডাউনলোড ফাইল() সংজ্ঞায়িত করা হয়, যা একটি নতুন তৈরি করে <a> সঙ্গে উপাদান href ডাউনলোড করা ফাইলের URL-এ অ্যাট্রিবিউট সেট করুন এবংডাউনলোড ডাউনলোড করা ফাইলের জন্য পছন্দসই ফাইলের নামের সাথে বৈশিষ্ট্য সেট করুন।
ফাংশন তারপর যোগ করে <a> উপাদান থেকে <body> উপাদান, একটি ক্লিক ইভেন্ট অনুকরণ <a> উপাদান ব্যবহার করে link.click(), এবং সরিয়ে দেয় <a> ডাউনলোড ট্রিগার হওয়ার পরে DOM থেকে উপাদান।
ব্যবহারকারী যখন "পিডিএফ ডাউনলোড করুন" বোতামে ক্লিক করেন, তখন downloadFile() ফাংশন বলা হয়, যা নির্দিষ্ট ফাইলের নামের সাথে ফাইল ডাউনলোড ডায়ালগ বক্সকে ট্রিগার করে এবং ব্যবহারকারীকে প্রদত্ত URL থেকে ফাইলটি ডাউনলোড করতে দেয়।
ব্যবহারকারী যখন "পিডিএফ ডাউনলোড করুন" বোতামে ক্লিক করেন, তখন downloadFile() ফাংশন বলা হয়, যা নির্দিষ্ট ফাইলের নামের সাথে ফাইল ডাউনলোড ডায়ালগ বক্সকে ট্রিগার করে এবং ব্যবহারকারীকে প্রদত্ত URL থেকে ফাইলটি ডাউনলোড করতে দেয়।
মনে রাখবেন যে ইউআরএলটি আপনার সার্ভারের প্রকৃত ফাইলের দিকে নির্দেশ করবে যা আপনি ডাউনলোডের জন্য উপলব্ধ করতে চান।
If you have any doubts, please let me know