এইচটিএমএল৫ বেসিক ফরম্যাট - HTML5 Besic Format



এইচটিএমএল পেজের গঠন

নিচে একটি সাধারণ এইচটিএমএল পেজের গঠন দেখানো হলো।

<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>

নোট - শুধুমাত্র <body> সেকশনের কন্টেন্ট গুলোই ব্রাউজারে প্রদর্শিত হয়।


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

ট্যাগ গুলোকে নামের সুরুতে এবং সেসে angle bracket দিয়ে আব্রত করে রাখা হয়।

উদাহরণ

<h1>content goes here...</h1>


এইচটিএমএল ট্যাগ সচরাচর জোড়ায়-জোড়ায় থাকে। যেমন <p> এবং </p>.
জোড়ার প্রথম ট্যাগকে opening ট্যাগ এবং দ্বিতীয় ট্যাগকে closing ট্যাগ বলা হয়।
closing ট্যাগকে opening ট্যাগের মতই লেখা হয়, ক্লোজিং ট্যাগের ক্ষেত্রে ট্যাগের নামের আগে শুধুমাত্র একটি ফরওয়ার্ড স্ল্যাশ(/) দিতে হয়।

নোট - opening ট্যাগকে start ট্যাগ এবং closing ট্যাগকে end ট্যাগ বলা হয়।


একটি সাধারণ html ডকুমেন্ট অর্থাৎ ওয়েব পেজ

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>


উপরের উদাহরণটির বিভিন্ন অংশের বিস্তারিত বর্ণনা দেখুন

ডকুমেন্টের টাইপ সেট করতে <!DOCTYPE html> ডিক্লেয়ার করা হয়। এটি এইচটিএমএল এর সর্বশেষ ভার্সন HTML5 কে নির্দেশ করে।
<html> এবং </html> ট্যাগের মাঝের কন্টেন্টগুলো এইচটিএমএল ডকুমেন্টকে বর্ণনা করে।
<head> এবং </head> ট্যাগের মাঝের কন্টেন্টগুলো এইচটিএমএল ডকুমেন্টের জন্য অতিরিক্ত তথ্য সরবরাহ করে।
<title> এবং </title> ট্যাগের মাঝের টেক্সট ডকুমেন্টের টাইটেল/নাম সেট করে।
<body> এবং </body> ট্যাগের মাঝের কন্টেন্টগুলো ওয়েব পেজে প্রদর্শিত হয়।
<h3> এবং </h3> ট্যাগ ডকুমেন্টের একটি হেডিং/শিরোনাম তৈরি করে। হেডিং ট্যাগ কন্টেন্ট এর গুরুত্ব আরোপ করে।
<img> ট্যাগ এর মাধ্যমে ব্রাউজারে বিভিন্ন টাইপের ইমেজ/চিত্র প্রদর্শিত হয়।


<!DOCTYPE> ডিক্লারেসন

<!DOCTYPE> ডিক্লেয়ারেশন ডকুমেন্টের টাইপ নির্ধারণ করে এবং একটি ওয়েব পেজকে সঠিকভাবে ব্রাউজারে দেখাতে সাহায্য করে। যেকোনো ওয়েব ডকুমেন্টের এটিই প্রথম ট্যাগ অর্থাৎ সকল এইচটিএমএল ট্যাগের পূর্বেই এই ট্যাগটি শুধুমাত্র একবার লিখতে হয়।

বিভিন্ন ধরনের ডকুমেন্ট টাইপ ও ভার্সন রয়েছে। তাই ওয়েব পেজকে সঠিকভাবে দেখানোর জন্য ব্রাউজারকে টাইপ ও ভার্সন দুটিই জানাতে হয়। DOCTYPE ডিক্লেয়ারেশন কেস-সেন্সিটিভ নয়। এতে ছোট এবং বড় উভয় ধরনের অক্ষরই গ্রহনযোগ্য।

এইচটিএমএলের ৫ এর জন্য <!DOCTYPE> ডিক্লেয়ারেশন নিম্নরুপ -

উদাহরণ

<!DOCTYPE html>




এইচটিএমএল ৪.০১

এইচটিএমএল ৪.০১ এ ৩ ভাবে ডকটাইপ ডিকলারেশন করা যায়। এগুলো হল নিম্নরূপ -

Strict,
Transitional,
Frameset


এইচটিএমএল ৪.০১ Strict

কোন ডেপ্রিকেটেড ট্যাগ, এট্রিবিউট এবং ফ্রেমসেট এই ডকুমেন্ট ফরম্যাটে ব্যবহার করা যায় না। এইচটিএমএল ৪.০১ ভার্সনের উপযুক্ত ফরম্যাট এটি। এটি লেখার নিয়মটি নীচে দেয়া হল -

উদাহরণ দেখুন

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">




এইচটিএমএল ৪.০১ Transitional

ওয়েব পেজে ডেপ্রিকেটেড ট্যাগ, এট্রিবিউট ব্যবহার করার প্রয়োজন হলে এই রকমভাবে ডকটাইপ ডিকলারেশন করা হয়। এটি লেখার নিয়মটি নীচে দেয়া হল -

উদাহরণ দেখুন

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">




এইচটিএমএল ৪.০১ Frameset

ফ্রেমসেট ব্যবহার করে ওয়েব পেজ তৈরি করার জন্য এই রকমভাবে ডকটাইপ ডিকলারেশন করা হয়। এটি লেখার নিয়মটি নীচে দেয়া হল -

উদাহরণ দেখুন

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">








এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Copyright 2016-2018 by websschool.com, All Rights Reserved.