এইচটিএমএল <option> ট্যাগ
<option> ট্যাগের ব্রাউজার সাপোর্ট
| এলিমেন্ট | Google Chrome | Edge/IE | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
<option> |
সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন |
সংজ্ঞা ও ব্যবহার
<option> এলিমেন্ট সিলেক্ট লিস্টে অপশন তৈরি করে। অর্থাৎ <select> এলিমেন্টে দ্বারা তৈরি ড্রপ-ডাউন লিস্টে অপশন তৈরি করার জন্য <option> এলিমেন্টটি ব্যবহার করা হয়।
<option> এলিমেন্টটি <select> অথবা <datalist> এলিমেন্টের ভিতরে ব্যবহার করা যায়।
কিভাবে <select> এলিমেন্টের ভিতর <option> এলিমেন্টটি ব্যবহার করা যায় তা নিচের উদাহরণে দেখানো হলোঃ
উদাহরণ
৪ টি অপশোনের সাথে একটি ড্রপ ডাউন লিস্টঃ
<!DOCTYPE html>
<html>
<body>
<select>
<option value="HTML">HTML</option>
<option value="CSS">CSS</option>
<option value="Javascript">Javascript</option>
<option value="PHP">PHP</option>
</select>
</body>
</html>
ফলাফল
টীকা ও মন্তব্যঃ
<option>ট্যাগটি আমরা কোন এট্রিবিউট ছাড়াই ব্যবহার করতে পারি। কিন্তু সার্ভারের সাথে কানেক্ট করার জন্যvalueএট্রিবিউটটি অবশ্যই লাগবে।- যদি অপশন অনেক বেশি পরিমানে থাকে তবে তাদেরকে গ্রুপ করার জন্য
<optgroup>এলিমেন্টটি ব্যবহার করুন।
এট্রিবিউট
নিচের টেবিলে <option> ট্যাগের এট্রিবিউট, এট্রিবিউটের ভ্যালু এবং তাদের ব্যবহার তুলে ধরা হলোঃ
| এট্রিবিউট | ভ্যালু | বর্ননা |
|---|---|---|
| disabled | disable | কোন একটি অপশনকে নিস্ক্রিয়/ডিজেবল করার জন্য ব্যবহার করা হয়। |
| label | text | অপশনের জন্য একটি সংক্ষিপ্ত লেভেল নির্ধারণ করে। |
| selected | selected | যখন একটি পেজ লোড হবে তখন কোন অপশনটি পূর্ব থেকেই সিলেক্ট করা থাকবে সেটি নির্ধারণ করে। |
| value | text | সার্ভারে পাঠানোর জন্য একটি ভ্যালু নির্ধারণ করে। |
<option> ট্যাগে গ্লোবাল এবং ইভেন্ট এট্রিবিউট সাপোর্ট করে কিনা?
| গ্লোবাল এট্রিবিউট | ইভেন্ট এট্রিবিউট |
|---|---|
| সাপোর্ট করে | সাপোর্ট করে |