এইচটিএমএল <form> ট্যাগ
<form>
ট্যাগের ব্রাউজার সাপোর্ট
এলিমেন্ট | Google Chrome | Edge/IE | Mozila Firefox | Safari | Opera |
---|---|---|---|---|---|
<form> |
সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন | সকল ভার্সন |
সংজ্ঞা ও ব্যবহার
ব্যবহারকারী থেকে ইনপুট নেওয়ার জন্য ওয়েবপেজে ফরম তৈরী করতে <form>
এলিমেন্টটি ব্যবহার করা হয়।
<form>
এলিমেন্টের মধ্যে নিচের ফরম এলিমেন্ট থেকে এক বা একাধিক এলিমেন্ট অন্তুর্ভূক্ত থাকতে পারে অথবা একই এলিমেন্ট একের অধিক বার থাকতে পারেঃ
নিচের উদাহরণে কয়েকটি ইনপুট এলিমেন্ট সহ একটি ফরম দেখানো হলোঃ
উদাহরণ
<!DOCTYPE html>
<html>
<body>
<form action="action_page.php">
First Name: <input type="text" name="FirstName" value="Zehadul"><br>
Last Name: <input type="text" name="LastName" value="Islam"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
ফলাফল
এট্রিবিউট
নিচের টেবিলে <form>
ট্যাগের এট্রিবিউট, এট্রিবিউটের ভ্যালু এবং তাদের ব্যবহার তুলে ধরা হলোঃ
এট্রিবিউট | ভ্যালু | বর্ণনা |
---|---|---|
accept-charset | character_set | ফরম সাবমিট করার জন্য ক্যারেক্টার এনকোডিং নির্ধারণ করে। |
action | URL | যখন একটি ফরম সাবমিট দেওয়া হয় তখন কোথায় ফরম-ডাটা পাঠাতে হবে তা নির্দিষ্ট করে। |
on off |
একটি ফরম স্বয়ংক্রিয়ভাবে অন বা অফ হবে কিনা তা নির্দিষ্ট করে। | |
enctype | application/x-www-form-urlencoded multipart/form-data text/plain |
যখন সার্ভারে(শুধু method="post" এর জন্য) সাবমিট করা হবে তখন কিভাবে ফরম-ডাটা এনকোড হবে তা নির্দিষ্ট করে। |
method | get post |
যখন ফরম ডাটা সার্ভারে প্রেরণ করা হয় তখন HTTP মেথড ব্যবহারের নির্দেশ দেয়। |
name | text | একটি ফরম এর নাম নির্ধারণ করার জন্য ব্যবহৃত হয়। |
novalidate | novalidate | ফরম যখন সাবমিট করা হয় তখন ফরম ভ্যালিডেট করা হবে না মর্মে নির্দেশ প্রদান করে। |
target | _blank _self _parent _top |
ফরম সাবমিট দেওয়ার পর কোথায় প্রতিক্রিয়া প্রদর্শিত হবে তা নির্দিষ্ট করে। |
<form>
ট্যাগে গ্লোবাল এবং ইভেন্ট এট্রিবিউট সাপোর্ট করে কিনা?
গ্লোবাল এট্রিবিউট | ইভেন্ট এট্রিবিউট |
---|---|
সাপোর্ট করে | সাপোর্ট করে |
<form>
ট্যাগের ডিফল্ট স্টাইল
অধিকাংশ ব্রাউজারেই <form>
এলিমেন্ট নিম্নলিখিত স্টাইল ভ্যালুগুলো সহকারে প্রদর্শিত হয়ঃ
form {
display: block;
margin-top: 0em;
}