শীর্ষ প্রশ্ন
সময়রেখা
চ্যাট
প্রসঙ্গ
এইচটিএমএল
হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ উইকিপিডিয়া থেকে, বিনামূল্যে একটি বিশ্বকোষ
Remove ads
হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ (অথবা এইচটিএমএল, ইংরেজি: Hyper Text Markup Language (HTML) হলো ওয়েব ব্রাউজারে তথ্য প্রকাশ করার জন্য একটি আদর্শ মার্কআপ ভাষা। এইচটিএমএল ওয়েব পাতায় কোন তথ্য ও গঠন কিরকম হবে তা নির্ধারণ করে দেয়। সাধারনত এইচটিএমএল কে ওয়েব পাতার গঠনশৈলী সুন্দর করার সিএসএস ও আরো বেশি কার্যকর করার জন্য স্ক্রিপ্টিং ভাষা যেমন জাভাস্ক্রিপ্ট সাহায্য করে থাকে।
| এই নিবন্ধটি অসম্পূর্ণ। আপনি চাইলে এটিকে সম্প্রসারিত করে উইকিপিডিয়াকে সাহায্য করতে পারেন। |
 |
যেহেতু এইচটিএমএল এর ফলাফল শুধুমাত্র ওয়েব ব্রাউজারে দেখা যায় তাই, ওয়েব ব্রাউজার এইচটিএমএল এর ফাইলগুলো ওয়েব সার্ভার অথবা লোকাল স্টোরেজ থেকে গ্রহন করে এবং তারপর প্রক্রিয়া করে মাল্টিমিডিয়া ওয়েব পেজে রূপান্তর করে।
এইচটিএমএল উপাদানগুলো হলো এইচটিএমএল পেজ তৈরির মৌলিক কাঠামো।
html এর বেশ কিছু ট্যাগ রয়েছে যেমন :<body></body>, <video></video>, <a></a>, </br> আরো অনেক ট্যাগ রয়েছে যা html স্ট্রাকটারে বানাতে কাজে লাগে ।[২]
এইচটিএমএলের নির্দেশনায় বিভিন্ন উপাদান যেমন ছবি ও অন্যান্য ওয়েব ফরম প্রক্রিয়াকৃত পেজে এমবেডেড অবস্থায় থাকে। নিয়মানুসারে কাঠামোবদ্ধ ওয়েবপেজ গঠন করার ক্ষেত্রে এইচটিএমএল বিভিন্ন শাব্দিক ট্যাগ তৈরি করে দেয় যেমন, headings, paragraphs, lists, links, quotes, এবং অন্যান্য উপাদান। এইচটিএমএলের উপাদানগুলোকে ট্যাগ বলা হয়, যে ট্যাগগুলো আবার কোণ বন্ধনীদ্বারা যুক্ত থাকে। <img> এবং <input> ট্যাগগুলো সরাসরি ওয়েবপেজে বিষয়বস্তু প্রকাশ করে। অন্যান্য ট্যাগ যেমন <p> এবং </p> তথ্য অনুচ্ছেদের দুপাশে থাকে এবং সাব-এলিমেন্ট ট্যাগ অন্তর্ভুক্ত করে থাকে। ব্রাউজার এইচটিএমএল ট্যাগ প্রকাশ করেনা কিন্ত এইচটিএমএল ট্যাগকে ব্যবহার করে ওয়েবপেজে তথ্য প্রকাশ করে থাকে।
বিভিন্ন স্ক্রিপ্টিং ভাষা যেমন জাভাস্ক্রিপ্টে এইচটিএমএল যুক্ত হয়ে থাকতে পারে এবং সেটা ওয়েব পেজের আচরণ এবং বিষয়বস্তুর উপর প্রভাব ফেলে। পাশাপাশি সিএসএস যুক্ত হয়ে এইচটিএমএল এর সৌন্দর্য ও গঠনশৈলীর পরিবর্তন নিয়ে আসে।
Remove ads
ইতিহাস
১৯৮০ সালে ব্রিটিশ কম্পিউটার বিজ্ঞানী টিম বার্নার্স-লি, যিনি সার্ন এ একজন ঠিকাদার ছিলেন, সর্বপ্রথম সার্ন গবেষকদের মাঝে দস্তাবেজ শেয়ার করার জন্য ENQUIRE prototyped নামে একটি System এর প্রস্তাব দেন। ১৯৮৯ সালে, বার্নার্স-লি একটি ইন্টারনেট ভিত্তিক হাইপারটেক্সট সিস্টেম প্রস্তাবে একটি মেমো লিখেন। ১৯৯০ সালে বার্নার্স-লি ব্রাউজার এবং সার্ভারের সফ্টওয়্যারে এইচটিএমএল (HTML) এর উল্লেখ করেন ।এ বছরেই, বার্নার্স-লি এবং সার্ন এর তথ্য সিস্টেম ইঞ্জিনিয়ার Robert Cailliau যৌথভাবে সার্নকে এ প্রকল্পের জন্য অর্থায়নে অনুরোধ করেন, কিন্তু প্রকল্পটি আনুষ্ঠানিকভাবে সার্ন দ্বারা গৃহীত হয়নি।
Remove ads
ট্যাগ
কোড লেখার আগে পরে নির্দিষ্ট কিছু চিহ্নসহ নির্ধারিত কিছু শব্দ ব্যবহার করা হয়। এগুলোকে ট্যাগ বলে।
এইচটিএমএল ট্যাগ গুলো Element name আর angle bracket (<>) দিয়ে তৈরি । প্রতিটি ভাষা লেখার জন্য নির্দিষ্ট নিয়ম থাকে। এই নিয়ম বা ধরনকেই syntax বলে। এইচটিএমএল ট্যাগগুলো লেখার জন্যও নির্দিষ্ট সিন্ট্যাক্স আছে। এভাবে না লিখলে ব্রাউজার ট্যাগ অনুযায়ী কন্টেন্ট দেখাতে সমর্থ্য হবে না।
HTML tag এর syntax হলো-
| <tagname>content goes here...</tagname> |
Remove ads
বিভিন্ন কোড
সারাংশ
প্রসঙ্গ
হেডিং
এইচটিএমএল হেডিং <h1> থেকে <h6> ট্যাগসমূহ দ্বারা লেখা হয়।[৩] h1 হচ্ছে সবচেয়ে বড় হেডিং এবং ক্রমান্বয়ে h6 সবচেয়ে ছোট। বিভিন্ন ধরনের বড় ছোট হেডিং নিম্নরূপে লেখা হয়।
<htlm>
<body>
<p> HSC TEXT BOOK </p>
<small> ICT TEXT BOOK </small> </p>
<big> ICT HSC TEXT BOOK </big> </p>
<b> ICT TEXT BOOK </b> </p>
<i> This is italic text </i> </p>
<u> This is underline text </u> </p>
<ins> This is inserted text </ins> </p>
<strong> This is strong text </strong </p>
<em> This is emphasized text </em> </p>
<del> This is deleteted text </del> </p>
<mark> This is word marked text </mark> </p>
<s> This is stirke text </s> </p>
<strike> This is strike text </strike> </p>
This is <sub> subscript </sub> text </p>
This is <sup> superscript </sup> text </p>
</body>
</html>
অনুচ্ছেদ ট্যাগ
কোন অনুচ্ছেদ লেখার জন্যে আরম্ভ ট্যাগ হিসেবে <p> এবং সমাপ্তি ট্যাগ হিসেবে </p> ব্যবহার করতে হয়। উদাহরণঃ
<p>আপনার কাঙ্ক্ষিত অনুচ্ছেদ</p>
এইচটিএমএল টেবিল
এইচটিএমএল এ টেবিল তৈরী করার জন্য নিম্নের কোড ব্যবহার করা হয়। টেবিল তৈরীতে চার ধরনের Tag ব্যবহার করা হয়।
- <tr> ট্যাগ ব্যবহার করা হয় Table Row লেখার জন্য ।
- <th> ট্যাগ ব্যবহার করা হয় Table Header লেখার জন্য ।
- <td> ট্যাগ ব্যবহার করা হয় table Data লেখার জন্য ।
<!DOCTYPE html>
<html lang="bn">
<head>
<title>দেশ সম্পর্কিত টেবিল</title>
</head>
<body>
<table border="1" cellpadding="10" cellspacing="0">
<tr>
<th>দেশের নাম</th>
<th>রাজধানী</th>
<th>জনসংখ্যা</th>
<th>মুদ্রা</th>
</tr>
<tr>
<td>বাংলাদেশ</td>
<td>ঢাকা</td>
<td>১৬৬.৩০ মিলিয়ন</td>
<td>বাংলাদেশি টাকা (BDT)</td>
</tr>
<tr>
<td>ভারত</td>
<td>নতুন দিল্লি</td>
<td>১.৪২ বিলিয়ন</td>
<td>ভারতীয় রুপি (INR)</td>
</tr>
<tr>
<td>পাকিস্তান</td>
<td>ইসলামাবাদ</td>
<td>২৩১.৪০ মিলিয়ন</td>
<td>পাকিস্তানি রুপি (PKR)</td>
</tr>
<tr>
<td>শ্রীলঙ্কা</td>
<td>কলম্বো</td>
<td>২১.৫৯ মিলিয়ন</td>
<td>শ্রীলঙ্কান রুপি (LKR)</td>
</tr>
</table>
</body>
</html>
এই কোড টি ঠিক এরকম হবে
<table border="1">
<tr>
<th>দেশের নাম</th>
<th>স্বাধীনতার বছর</th>
</tr>
<tr>
<td>বাংলাদেশ</td>
<td>১৯৭১</td>
</tr>
</table>
উপরের কোডটির আউটপুট হিসেবে নিচের টা আসবে।
এগুলো ছাড়া আরো অনেক ট্যাগ ব্যবহৃত হয়। যেমন
<li>...</li>
<ul>...</ul>
<ol>...</ol>
<img src="imagelink">...</img>
Remove ads
আরো দেখুন
তথ্যসূত্র
বহিঃসংযোগ
Wikiwand - on
Seamless Wikipedia browsing. On steroids.
Remove ads