এইচটিএমএল(৫) এলিমেন্ট-HTML5 Element
নতুন সিমেন্টিক এলিমেন্ট
এইচটিএমএল(৫) অপেক্ষাকৃত সুন্দর এবং সাজানো ডকুমেন্ট গঠনের জন্য নতুন এলিমেন্ট প্রস্তাব করেঃ
ট্যাগ |
বর্ণনা |
<article> |
ডকুমেন্টের মধ্যে একটি বিষয়বস্তু নির্ধারণ করে। |
<aside> |
পেজের কন্টেন্ট পাশাপাশি নির্ধারণ করে। |
<bdi> |
লেখার দিক নির্ধারণ করে। |
<details> |
অতিরিক্ত বিবরন থাকে যা ব্যবহারকারী দেখতে পারে অথবা লুকিয়ে রাখতে পারে। |
<dialog> |
একটি ডায়ালগ বক্স অথবা উইন্ডো ডিফাইন করে। |
<figcaption> |
একটি <figure> এলিমেন্টের শিরোনাম নির্ধারণ করে। |
<figure> |
স্বয়ংসম্পূর্ণ কন্টেন্ট ডিফাইন করে, যেমন illustrations, diagrams, photos, code listings ইত্যাদি। |
<footer> |
একটি ডকুমেন্ট অথবা সেকশনের একটি footer নির্ধারণ করে। |
<header> |
একটি ডকুমেন্ট অথবা সেকশনের একটি header নির্ধারণ করে। |
<main> |
একটি ডকুমেন্টের মুল বিষয়বস্তু নির্ধারণ করে। |
<mark> |
লেখা হাইলাইট করতে ব্যবহার করা হয়। |
<menuitem> |
একটি command/menu item তৈরি করবে যা ব্যবহারকারী একটি পপ-আপ মেন্যু আকারে পাবে। |
<meter> |
একটি গণনাযোগ্য পরিমাপ নির্ধারণ করে। |
<nav> |
ডকুমেন্টের মধ্যে একটি নেভিগেশন লিংক নির্ধারণ করে। |
<progress> |
একটি কাজের অগ্রগতি নির্ধারণ করে। |
<rp> |
ruby অ্যানোটেশন সাপোর্ট করে না এমন ব্রাউজারের জন্য ব্যবহার করা হয়। |
<rt> |
East Asian typography এর জন্য ক্যারেক্টারের ব্যাখ্যা/উচ্চারন নির্ধারণ করে। |
<ruby> |
East Asian typography এর জন্য ruby অ্যানোটেশন নির্ধারণ করে। |
<section> |
ডকুমেন্টের মধ্যে একটি সেকশন নির্ধারণ করে। |
<summary> |
একটি <details> এলিমেন্টের দৃশ্যমান হেডিং নির্ধারণ করে। |
<time> |
তারিখ/সময় নির্ধারণ করে। |
<wbr> |
সম্ভাব্য line-break নির্ধারণ করে। |
নতুন ফর্ম এলিমেন্ট
ট্যাগ |
বর্ণনা |
<datalist> |
ইনপুটের জন্য পূর্বনির্ধারিত অপশন নির্ধারণ করে। |
<keygen> |
form এর জন্য একটি কী তৈরির ফিল্ড নির্ধারণ করে। |
<output> |
একটি হিসাবের ফলাফল নির্ধারণ করে।। |
ইনপুট টাইপ ও এট্রিবিউট
নতুন ইনপুট টাইপ সমূহঃ
ভ্যালু |
বর্ণনা |
email |
বৈধ ই-মেইল ইনপুট করার জন্য <input type="email"> ব্যবহার করা হয়। |
number |
শুধু মাত্র সংখ্যা ইনপুট করার জন্য <input type="number"> ব্যবহার করা হয়। |
range |
ইনপুট ফিল্ডের ভ্যালুর সীমা নির্ধারণ করার জন্য <input type="range"> ব্যবহার করা হয়। |
tel |
টেলিফোন নাম্বার ইনপুট করার জন্য <input type="tel"> ব্যবহার করা হয়। |
month |
তারিখের মধ্যে বছর এবং মাস ইনপুট করার জন্য <input type="month"> ব্যবহার করা হয়। |
week |
তারিখের মধ্যে বছর এবং সপ্তাহ ইনপুট করার জন্য <input type="week"> ব্যবহার করা হয়। |
date |
তারিখ ইনপুট করার জন্য <input type="date"> ব্যবহার করা হয়। |
time |
সময় ইনপুট করার জন্য <input type="time"> ব্যবহার করা হয়। |
datetime |
সময় এবং তারিখ ইনপুট করার জন্য <input type="datetime"> ব্যবহার করা হয়। |
datetime-local |
সময় এবং তারিখ ইনপুট করার জন্য <input type="datetime-local"> ব্যবহার করা হয়। |
color |
কালার ভ্যালু ইনপুট করার জন্য <input type="color"> ব্যবহার করা হয়। |
search |
ইনপুট ফিল্ডে সার্চবক্স হিসাবে ডেটা ইনপুট করার জন্য <input type="search"> ব্যবহার করা হয়। |
url |
ব্যবহারকারীর কাছ থেকে লিংক ইনপুট করার জন্য <input type="url"> ব্যবহার করা হয়। |
নতুন ইনপুট এট্রিবিউট সমূহঃ
এট্রিবিউট |
বর্ণনা |
autocomplete |
পূর্বে ইনপুটকৃত ভ্যালু থেকে নতুন ভ্যালু ইনপুট করতে সাহায্য করে। |
autofocuas |
পেজ লোড হওয়া সম্পন্ন হলে ইনপুট ফিল্ডটি সিলেক্টেড থাকবে কিনা তা নির্ধারণ করে। |
form |
ফর্মের বাইরের ইনপুট ট্যাগকে আইডির মাধ্যমে ফর্মের সাথে লিংক করে। |
formaction |
ফর্মের মূল action এট্রিবিউটকে ওভার-রাইট করে অর্থাৎ সাবমিটের জন্য নতুন একটি লিংক নির্ধারণ করে। |
formenctype |
post মেথোডের ক্ষেত্রে সার্ভারে সাবমিটকৃত ডেটার এনকোডিং পদ্ধতি নির্ধারণ করে। |
formmethod |
সার্ভারে ফর্ম ডেটা পাঠানোর HTTP মেথোড নির্ধারণ করে। এটি ফর্মের মূল মেথোডকে ওভার-রাইড করে। |
formvalidation |
ইনপুট ফিল্ডের তথ্যের বৈধতা যাচাই বাতিল করে। |
formtarget |
ইনপুট এলিমেন্টের জন্য এটি target এট্রিবিউটের কাজ করে এবং ফর্ম এলিমেন্টে বিদ্যমান target এট্রিবিউটকে ওভার-রাইড করে। |
height এবং width |
ইমেজ ইনপুট ফিল্ডের দৈর্ঘ্য এবং প্রস্থ নির্ধারণ করে। |
list |
পূর্বনির্ধারিত ভ্যালুর একটি লিস্টকে ইনপুট ফিল্ডের সাথে আইডির মাধ্যমে লিংক করতে ব্যবহার করা হয়। |
minimum এবং maximum |
ইনপুট ফিল্ডের সর্বনিন্ম এবং সর্বোচ্চ ভ্যালু নির্ধারণ করে। |
multiple |
ইনপুট ফিল্ডে একত্রে একাধিক ভ্যালু সিলেক্ট করা সম্ভব হয়। এটি email এবং file টাইপের ক্ষেত্রে কাজ করে। |
pattern |
ইনপুট ফিল্ডের ভ্যালুর জন্য প্যাটার্ন নির্ধারণ করে। |
placeholder |
ইনপুট ফিল্ডের ইনপুটকৃত তথ্য সম্পর্কে ব্যবহারকারীকে অবগত করে। যা ইনপুট ফিল্ডে টাইপ করা শুরু করলে অদৃশ্য হয়ে যায়। |
required |
যদি ইনপুট ফিল্ডটি খালি থাকলে ব্যবহারকারীকে একটি সতর্কবার্তা দেয় এবং ফর্মটি সাবমিট হয় না। |
step |
পূর্ণ সংখ্যার মধ্যবর্তী ব্যবধান নির্ধারণ করে। |
এইচটিএমএল(৫) - নতুন এট্রিবিউটের গঠনপ্রণালী
এইচটিএমএল(৫) এ এট্রিবিউট চারভাবে লিখা যায়। নিম্নে <input>
ইনপুট এলিমেন্টের চারটি গঠনপ্রণালী দেখানো হলোঃ
টাইপ |
উদাহরণ |
এম্পটি |
<input type="text" value="Azizur" disabled> |
উদ্ধৃতিবিহীন |
<input type="text" value=Azizur> |
দুইটি উদ্ধৃতিসহ |
<input type="text" value="Azizur Rahman"> |
একটি উদ্ধৃতিসহ |
<input type="text" value='Azizur Rahman'> |
এইচটিএমএল(৫) গ্রাফিক্স এলিমেন্ট
ট্যাগ |
বর্ণনা |
<canvas> |
জাভাস্ক্রিপ্ট ব্যবহার করে এই এলিমেন্টে গ্রাফিক্স তৈরি করা হয়। |
<svg> |
এসভিজি(SVG) ব্যবহার করে গ্রাফিক্স অঙ্কন নির্ধারণ করে। |
মিডিয়া এলিমেন্ট
ট্যাগ |
বর্ণনা |
<audio> |
শব্দ অথবা মিউজিক কন্টেন্ট ডিফাইন করে। |
<embed> |
এক্সটার্নাল এপ্লিকেশনের জন্য কন্টেইনার নির্ধারণ করে (যেমনঃ plug-ins)। |
<source> |
<video> এবং <audio> ট্যাগের উৎস নির্ধারণ করে। |
<track> |
<video> এবং <audio> ট্যাগের ট্র্যাক নির্ধারণ করে। |
<video> |
ভিডিও কন্টেন্ট নির্ধারণ করে। |