এইচটিএমএল৫ নতুন এলিমেন্ট - html5 New Element

নীচে HTML5 এর নতুণ এলিমেন্টগুলোর একটি তালিকা এবং তাদের জন্য কী ব্যবহার করা হয় তার বিবরণ দেয়া হল।

সিমেন্টিক এলিমেন্ট

এইচটিএমএল ৫ এ অপেক্ষাকৃত সুন্দর এবং সাজানো ডকুমেন্ট গঠনের জন্য নতুন এলিমেন্ট যোগ করা হয়েছে। নিচে এগুলো দেখুন।

ট্যাগ	বর্ণনা
<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	পূর্বনির্ধারিত ভ্যালুর একটি লিস্টকে ইনপুট ফিল্ডের সাথে আইডির মাধ্যমে লিংক করতে ব্যবহার করা হয়।
min এবং max	ইনপুট ফিল্ডের সর্বনিন্ম এবং সর্বোচ্চ ভ্যালু নির্ধারণ করে।
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>	ভিডিও কন্টেন্ট নির্ধারণ করে।

এইচটিএমএল ৫ এর ভিডিও সম্পর্কে জানতে আমাদের এইচটিএমএল ৫ - ভিডিও টিউটোরিয়ালটি দেখুন।

এইচটিএমএল ৫ এর অডিও সম্পর্কে জানতে আমাদের এইচটিএমএল ৫ - অডিও টিউটোরিয়ালটি দেখুন।

«পূর্ববর্তীপাতা

পরবর্তীপাতা»

বেসিক

ফর্ম