html

এইচটিএমএল এলিমেন্ট (HTML Element)

4.4/5 - (7 votes)

স্টার্ট ট্যাগ থেকে শুরু করে ক্লোজিং ট্যাগ পর্যন্ত সব কিছুই এইচটিএমএল এলিমেন্ট (HTML Element)।

নিচে একটি উদাহরণ দেওয়া হল-

<h1>My First Heading</h1>
<p> My first paragraph.</p>

স্টার্ট ট্যাগকনটেন্ট এলিমেন্টক্লোজিং ট্যাগ
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<br>nonenone

[box type=”info” align=”” class=”” width=””]কিছু কিছু এইচটিএমএল এলিমেন্ট এর কোন কনটেন্ট থাকে না। যেমনঃ <br>, <hr> ইত্যাদি। এদেরকে এমটি এলিমেন্ট বলা হয় এবং এদের ক্লোজিং ট্যাগ থাকে না।[/box]

নেস্টেড এইচটিএমএল এলিমেন্ট

যখন একটি এইচটিএমএল এলিমেন্ট অন্য কতগুলো এইচটিএমএল এলিমেন্ট এর সমন্বয়ে গঠিত হয় তখন তাকে নেস্টেড এইচটিএমএল এলিমেন্ট। অর্থাৎ এইচটিএমএল ডকুমেন্টে নেস্টেড এইচটিএমএল এলিমেন্ট থাকতে পারে। নিচের উদাহরণটি লক্ষ্য করুন।

<!DOCTYPE html>
<html>
<body>

<p>This is nested <b> HTML tag</b></p>

</body>
</html>

[button color=”red” size=”big” link=”https://www.hazabarolo.com/html-example/nasted-html.html” icon=”” target=”true” nofollow=”false”]নিজে চেষ্টা করুন[/button]

উপরের উদাহরণটি লক্ষ্য করুন। এখানে মূল এইচটিএমএল ট্যাগটি <p> ট্যাগ এর ভিতর আবন্ধ। অর্থাৎ এটি একটি প্যারাগ্রাফকে নির্দেশ করছে। এখন এই প্যারাগ্রাফটির ভিতর একটি অংশ <b> ট্যাগ এর ভিতর আবদ্ধ রয়েছে। অর্থাৎ এই অংশের লিখাটি মোটা (bold) হবে। এটি হল নেস্টেড এইচটিএমএল এলিমেন্ট।

[box type=”warning” align=”” class=”” width=””]নেস্টেড এইচটিএমএল এলিমেন্ট এর কিছু নিয়ম রয়েছেঃ

[tie_list type=”lightbulb”]

  • প্রত্যেক উপাদান সম্পূর্ণভাবে নেষ্টেড হতে হবে।
  • ক্লোজিং ট্যাগ সঠিক ক্রমানুসারে হতে হবে। 
  • ব্লক লেভেল উপাদানকে টেক্সট লেভেল উপাদানের মাঝে নেষ্টিং করা যাবে না।

[/tie_list]

 [/box]

এমটি এইচটিএমএল এলিমেন্ট

কিছু কিছু এইচটিএমএল এলিমেন্ট রয়েছে যাদের কোন কনটেন্ট নেই। এদেরকে এমটি এইচটিএমএল এলিমেন্ট বলা হয়। তাছাড়া এদের কোন ক্লোজিং ট্যাগ নেই। যেমনঃ
<br> এই ট্যাগটি দ্বারা নতুন লাইন তৈরি করা হয়। লক্ষ্য করে দেখুন এটির কোন কনটেন্ট নেই এবং ক্লোজিং ট্যাগ নেই।

<hr> এই ট্যাগটি দিয়ে horizontal line তৈরি করা হয়।

<!DOCTYPE html>
<html>
<body>

<p>This is a <br> paragraph with a line break.</p>
<p>This is a <hr> a line break.</p>

</body>
</html>

[button color=”red” size=”big” link=”https://www.hazabarolo.com/html-example/empty-html.html” icon=”” target=”true” nofollow=”false”]নিজে চেষ্টা করুন[/button]

Lowercase এইচটিএমএল ট্যাগ

এইচটিএমএল ট্যাগ কেস সেনসিটিভ নয়। অর্থাৎ Lowercase বা UPPERCASE যেভাবেই ট্যাগ লিখেন না কেনো তা কাজ করবে। যেমনঃ <P> ও <p> একই কাজ করবে।

তবে এইচটিএমএল ৫.০ এর স্ট্যান্ডার্ডে Lowercase ট্যাগ ব্যবহার করার জন্য কোন রকম বাধ্য-বাদ্ধকতা নেই। কিন্তু W3C এইচটিএমএল-এ Lowercase বা ছোট হাতের অক্ষর ব্যবহার করার জন্য সমর্থন করে এবং XHTML এর মতো স্ট্রাইকার ডকুমেন্টের জন্য ছোট হাতের অক্ষরগুলি ব্যবহার করার সমর্থন করে।


 এই রকম আরও তথ্য পেতে আমাদের ফেসবুক পেজে লাইক দিয়ে যুক্ত থাকুন। এর পাশাপাশি গুগল নিউজে আমাদের ফলো করুন। 

Rimon

This is RIMON Proud owner of this blog. An employee by profession but proud to introduce myself as a blogger. I like to write on the blog. Moreover, I've a lot of interest in web design. I want to see myself as a successful blogger and SEO expert.

মন্তব্য করুন

Related Articles

Back to top button