তালিকা বাক্সটি HTML নথিতে একটি গ্রাফিকাল নিয়ন্ত্রণ উপাদান যা ব্যবহারকারীকে বিকল্পগুলির তালিকা থেকে এক বা একাধিক বিকল্প নির্বাচন করতে দেয়।
বাক্য গঠন
একটি তালিকা বাক্স তৈরি করতে, HTML উপাদান <select> ব্যবহার করুন যাতে দুটি বৈশিষ্ট্য রয়েছে Name এবং Size। নাম বৈশিষ্ট্যটি তালিকা বাক্সে কল করার জন্য নামটি সংজ্ঞায়িত করতে ব্যবহৃত হয় এবং আকারের বৈশিষ্ট্যটি সংখ্যাসূচক মান নির্দিষ্ট করতে ব্যবহৃত হয় যা এটিতে কতগুলি বিকল্প রয়েছে তা দেখায়।
- </select Name=“Name_of_list_box” Size=“Number_of_options”>
- <option> List item 1 </option>
- <option> List item 2 </option>
- <option> List item 3 </option>
- <option> List item N </option>
- </select>
উদাহরণ 1: নীচের উদাহরণটি বিবেচনা করুন যা একটি সাধারণ তালিকা বাক্স তৈরি করে।
- </!DOCTYPE html>
- </html>
- </title>
- Example of List Box
- </title>
- </body>
- Customer Name: <input type=“text” Placeholder=“Enter the Customer Name”/>
- <br>
- <br>
- </select name=“Cars” size=“5”>
- <option value=“Merceders”> Merceders </option>
- <option value=“BMW”> BMW </option>
- <option value=“Jaguar”> Jaguar </option>
- <option value=“Lamborghini”> Lamborghini </option>
- <option value=“Ferrari”> Ferrari </option>
- <option value=“Ford”> Ford </option>
- </select>
- </body>
- </html>
উদাহরণ 2: নীচের উদাহরণটি একটি তালিকার একাধিক বিকল্প নির্বাচন করার জন্য একাধিক বৈশিষ্ট্য ব্যবহার করে। আমরা ctrl কী ধরে তালিকা বক্স থেকে একাধিক বিকল্প নির্বাচন করতে পারি।
- </!DOCTYPE html>
- </html>
- </title>
- Example of List Box with multiple attribute
- </title>
- </body>
- Customer Name: <input type=“text” Placeholder=“Enter the Customer Name”/>
- <br>
- <br>
- </select name=“Cars” size=“5” multiple=“multiple”>
- <option value=“Merceders”> Merceders </option>
- <option value=“BMW”> BMW </option>
- <option value=“Jaguar”> Jaguar </option>
- <option value=“Lamborghini”> Lamborghini </option>
- <option value=“Ferrari”> Ferrari </option>
- <option value=“Ford”> Ford </option>
- </select>
- </body>
- </html>
