এইচটিএমএল <datalist> ট্যাগ
<datalist> ট্যাগের ব্রাউজার সাপোর্ট
| এলিমেন্ট | Google Chrome | Edge/IE | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
<datalist> |
সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সাপোর্ট করে না | সকল ভার্সন |
সংজ্ঞা ও ব্যবহার
<datalist> ট্যাগ <input> এলিমেন্টের জন্য পূর্বনির্ধারিত অপশনের একটি লিস্ট তৈরি করে।
<datalist> ট্যাগ <input> এলিমেন্টে "autocomplete" নামে একটি ফিচার সরবরাহ করে। ব্যবহারকারী পূর্বনির্ধারিত কিছু অপশনের ড্রপ-ডাউন লিস্ট দেখতে পাবে যাতে সে ডাটা ইনপুট করতে পারে।
<datalist> এলিমেন্টের সাথে যুক্ত করতে <input> এলিমেন্টের list এট্রিবিউটটি ব্যবহার করুন।
<datalist> এলিমেন্টটি কিভাবে <input> এলিমেন্টের সাথে ব্যবহার করা যায় তা নিচের উদাহরণের মাধ্যমে দেখানো হলোঃ
উদাহরণ
<!DOCTYPE html>
<html>
<body>
<form action="action_page.php" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<input type="submit">
</form>
</body>
</html>
বিঃদ্রঃ <datalist> ট্যাগটি সাফারি, ইন্টারনেট এক্সপ্লোরার(৯) এবং তার আগের ভার্সনগুলোতে সাপোর্ট করে না।
ফলাফল
<datalist> ট্যাগে গ্লোবাল এবং ইভেন্ট এট্রিবিউট সাপোর্ট করে কিনা?
| গ্লোবাল এট্রিবিউট | ইভেন্ট এট্রিবিউট |
|---|---|
| সাপোর্ট করে | সাপোর্ট করে |
<datalist> ট্যাগের ডিফল্ট স্টাইল
অধিকাংশ ব্রাউজারেই <datalist> এলিমেন্ট নিম্নলিখিত স্টাইল ভ্যালুগুলো সহকারে প্রদর্শিত হয়ঃ
datalist {
display: none;
}