এইচটিএমএল ট্যাগ
🌈এইচটিএমএল ট্যাগ কি?
📋এইচটিএমএল ট্যাগ হলো বিভিন্ন এলিমেন্টের গঠন তৈরি করার পদ্ধতি।
⚒️এইচটিএমএল ট্যাগ বিভিন্ন এলিমেন্টের গঠন তৈরি করতে ব্যবহৃত হয়।
এইচটিএমএল ট্যাগ সমূহ
এইচটিএমএল ট্যাগ এবং সেগুলোর ব্যবহারের তালিকা
- ➡️ doctype - ডকুমেন্ট ঘোষণা করা
- ➡️ html - ওয়েব পৃষ্ঠার কাঠামো তৈরি করা
- ➡️ head - মেটা-ডেটা সংরক্ষণ করা
- ➡️ title - এলিমেন্টে টাইটেট নির্ধারণ করা
- ➡️ link - ফাইল লিংক সংযুক্ত করা
- ➡️ base - ডিফল্ট উআরএল নির্ধারণ করা
- ➡️ meta - মেটা ডেটা সংরক্ষণ করা
- ➡️ body - ওয়েবপেজের দৃশ্যমান অংশ প্রদর্শন করা
- ➡️ hr - অনুভূমিক রেখা তৈরি করা
- ➡️ br - নতুন লাইন তৈরি করা
- ➡️ menu - মেনু তৈরি করা
- ➡️ table - টেবিল উপস্থাপনা তৈরি করা
- ➡️ colgroup - টেবিল কলাম দলবদ্ধ করা
- ➡️ col - টেবিল কলাম নির্ধারণ করা
- ➡️ tr - টেবিলের সারি তৈরি করা
- ➡️ td - টেবিলের বর্ণনা তৈরি করা
- ➡️ tfoot - টেবিলের পদপৃষ্ঠ তৈরি করা
- ➡️ thead - টেবিলের হেড তৈরি করা
- ➡️ tbody - টেবিলের বডি তৈরি করা
- ➡️ th - টেবিলে হেডার তৈরি করা
- ➡️ caption - টেবিলের শিরোনাম নির্ধারণ করা
- ➡️ data - অবজেক্টে ডেটা রিসোর্স সংযুক্ত করা
- ➡️ ul - আন অর্ডার তালিকা তৈরি করা
- ➡️ nav - নেভিগেশন বার তৈরি করা
- ➡️ ol - অর্ডার তালিকা তৈরি করা
- ➡️ dl - বর্ণনার সংজ্ঞা তৈরি করা
- ➡️ dt - শিরোনাম নির্ধারণ করা
- ➡️ dd - বর্ণনা নির্ধারণ করা
- ➡️ li - তালিকা তৈরি করা
- ➡️ u - আন্ডারলাইন টেক্সট প্রদর্শন করা
- ➡️ b - গাঢ় মোটা টেক্সট প্রদর্শন করা
- ➡️ i - ইটালিক টেক্সট প্রদর্শন করা
- ➡️ em - গুরুত্বপূর্ণ টেক্সট প্রদর্শন করা
- ➡️ small - ছোট টেক্সট প্রদর্শন করা
- ➡️ del - বাতিল টেক্সট প্রদর্শন করা
- ➡️ ins - সন্নিবেশ টেক্সট প্রদর্শন করা
- ➡️ sub - সাবস্ক্রিপ্টেড টেক্সট প্রদর্শন করা
- ➡️ sup - সুপারস্ক্রিপ্টেড টেক্সট প্রদর্শন করা
- ➡️ cite - উদ্ধৃতির উৎস নির্দেশ করা
- ➡️ dfn - বর্ণনার সংজ্ঞা প্রদর্শন করা
- ➡️ q - টেক্সটর মধ্যে উদ্ধৃতি প্রদর্শন করা
- ➡️ s - স্ট্রাইকথ্রু টেক্সট প্রদর্শন করা
- ➡️ mark - হাইলাইট টেক্সট প্রদর্শন করা
- ➡️ span - বিঘত টেক্সট প্রদর্শন করা
- ➡️ strong - দৃঢ় টেক্সট প্রদর্শন করা
- ➡️ abbr - সংক্ষিপ্ত শব্দের সম্পূর্ণ টেক্সট প্রদর্শন করা
- ➡️ blockquote - উদ্ধৃতি চিহ্নিত করা
- ➡️ div - বিভাগ তৈরি করা
- ➡️ address - ব্যক্তি বা প্রতিষ্ঠানের যোগাযোগের ডেটা প্রদর্শন করা
- ➡️ wbr - শব্দ ভেঙে লাইন তৈরি করা
- ➡️ var - ভেরিয়েবল তৈরি করা
- ➡️ param - প্যারামিটার নির্ধারণ করা
- ➡️ script - জাভাস্ক্রিপ্ট কোড সংযুক্ত করা
- ➡️ noscript - নিষ্ক্রিয় স্ক্রিপ্ট করা
- ➡️ dialog - ডায়ালগ বক্স তৈরি করা
- ➡️ header - হেডার শাখা তৈরি করা
- ➡️ template - কনটেন্ট টেমপ্লেট তৈরি করা
- ➡️ article - স্বতন্ত্র কনটেন্ট উপস্থাপনা করা
- ➡️ footer - ফুটার সেকশন তৈরি করা
- ➡️ details - বিবরণ তৈরি করা
- ➡️ summary - বিবরণের সারাংশ তৈরি করা
- ➡️ aside - পার্শ্ববর্তী কনটেন্ট তৈরি করা
- ➡️ main - প্রধান বিভাগ তৈরি করা
- ➡️ section - কনটেন্ট সেকসন তৈরি করা
- ➡️ search - ডেটা অনুসন্ধান করা
- ➡️ hgroup - শিরোনাম দলবদ্ধ করা
- ➡️ h1 - সবচেয়ে বড় শিরোনাম প্রদর্শন করা
- ➡️ h2 - দ্বিতীয় বৃহত্তম শিরোনাম প্রদর্শন করা
- ➡️ h3 - তৃতীয় বৃহত্তম শিরোনাম প্রদর্শন করা
- ➡️ h4 - চতুর্থ বৃহত্তম শিরোনাম প্রদর্শন করা
- ➡️ h5 - পঞ্চম বৃহত্তম শিরোনাম প্রদর্শন করা
- ➡️ h6 - সবচেয়ে ছোট শিরোনাম প্রদর্শন করা
- ➡️ p - অনুচ্ছেদ প্রদর্শন করা
- ➡️ a - হাইপারলিঙ্ক তৈরি করা
- ➡️ time - সময় প্রদর্শন করা
- ➡️ samp - নমুনা টেক্সট প্রদর্শন করা
- ➡️ kbd - কীবোর্ড টেক্সট প্রদর্শন করা
- ➡️ bdo - টেক্সটের দিক পরিবর্তন করা
- ➡️ bdi - বিভিন্ন ভাষা প্রদর্শনের দিক ঠিক রাখা
- ➡️ pre - পূর্বনির্ধারিত টেক্সট প্রদর্শন করা
- ➡️ code - প্রোগ্রামিং কোড প্রদর্শন করা
- ➡️ embed - ফাইল সংযোগ স্থাপন করা
- ➡️ object - ফাইল সংযোগ সংযুক্ত করা
- ➡️ meter - পরিমাপ তৈরি করা
- ➡️ progress - কোনো কাজের অগ্রগতি প্রদর্শন
- ➡️ input - ডেটা গ্রহন করা
- ➡️ form - ফর্ম তৈরি করা
- ➡️ output - কার্যকর ফলাফল প্রদর্শন করা
- ➡️ fieldset - ফর্মের সীমানা তৈরি করা
- ➡️ legend - ফর্মের উপকথা সেট করা
- ➡️ datalist - ডেটা তালিকা তৈরি করা
- ➡️ select - মান নির্বাচন করা
- ➡️ label - বর্ণনা সেট করা
- ➡️ optgroup - দলবদ্ধ অপশন তৈরি করা
- ➡️ option - অপশন তৈরি করা
- ➡️ textarea - ডেটা গ্রহন করা
- ➡️ audio - ওয়েব পেজে অডিও ফাইল সংযুক্ত করা
- ➡️ video - ওয়েব পেজে ভিডিও ফাইল সংযুক্ত করা
- ➡️ source - ফাইল সংযুক্ত করা
- ➡️ track - টেক্সট ট্র্যাক তৈরি করা
doctype - ডকুমেন্ট ঘোষণা করার উদাহরণ।
html
<!DOCTYPE>
<html>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>html - ওয়েব পৃষ্ঠার কাঠামো তৈরি করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>head - মেটা-ডেটা সংরক্ষণ করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<head>
<title>ওয়েব পেজের শিরোনাম</title>
</head>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>title - এলিমেন্টে টাইটেট নির্ধারণ করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<head>
<title>ওয়েব পেজের শিরোনাম</title>
</head>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>link - ফাইল লিংক সংযুক্ত করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/project/style.css">
</head>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>base - ডিফল্ট উআরএল নির্ধারণ করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<head>
<base href="/html/tutorial/">
</head>
<body>
<a href="intro">পরিচিতি</a>
</body>
</html>meta - মেটা ডেটা সংরক্ষণ করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="author" content="মোঃ আরিফ">
</head>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>body - ওয়েবপেজের দৃশ্যমান অংশ প্রদর্শন করার উদাহরণ।
html
<!DOCTYPE html>
<html>
<body>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</body>
</html>hr - অনুভূমিক রেখা তৈরি করার উদাহরণ।
html
<h1>প্রোগ্রামিং শিখুন</h1>
<hr>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>br - নতুন লাইন তৈরি করার উদাহরণ।
html
<address>
নাম: মোঃ আরিফ<br>
তথ্য<br>
স্বপ্ন: সফটওয়্যার ইঞ্জিনিয়ার<br>
দেশ: বাংলাদেশ
</address>menu - মেনু তৈরি করার উদাহরণ।
html
<menu>
<li>পিএইচপি</li>
<li>জাভা</li>
<li>পাইথন</li>
<li>জাভাস্ক্রিপ্ট</li>
</menu>table - টেবিল উপস্থাপনা তৈরি করার উদাহরণ।
html
<table border="1">
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>colgroup - টেবিল কলাম দলবদ্ধ করার উদাহরণ।
html
<table>
<colgroup>
<col span="2" style="background-color:blue">
<col span="1" style="background-color:pink">
</colgroup>
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>col - টেবিল কলাম নির্ধারণ করার উদাহরণ।
html
<table>
<colgroup>
<col>
<col span="1" style="background-color:pink">
</colgroup>
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>tr - টেবিলের সারি তৈরি করার উদাহরণ।
html
<table border="1">
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>td - টেবিলের বর্ণনা তৈরি করার উদাহরণ।
html
<table border="1">
<thead>
<tr>
<th>নাম</th>
<th>মূল্য</th>
</tr>
<thead>
<tbody>
<tr>
<td>আপেল</td>
<td>10</td>
</tr>
<tr>
<td>আঙ্গুর</td>
<td>15</td>
</tr>
<tr>
<td>কমলা</td>
<td>10</td>
</tr>
<tr>
<td>কলা</td>
<td>25</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>মোট</td>
<td>60</td>
</tr>
</tfoot>
</table>tfoot - টেবিলের পদপৃষ্ঠ তৈরি করার উদাহরণ।
html
<table border="1">
<thead>
<tr>
<th>নাম</th>
<th>মূল্য</th>
</tr>
<thead>
<tbody>
<tr>
<td>আপেল</td>
<td>10</td>
</tr>
<tr>
<td>আঙ্গুর</td>
<td>15</td>
</tr>
<tr>
<td>কমলা</td>
<td>10</td>
</tr>
<tr>
<td>কলা</td>
<td>25</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>মোট</td>
<td>60</td>
</tr>
</tfoot>
</table>thead - টেবিলের হেড তৈরি করার উদাহরণ।
html
<table border="1">
<thead>
<tr>
<th>নাম</th>
<th>মূল্য</th>
</tr>
<thead>
<tbody>
<tr>
<td>আপেল</td>
<td>10</td>
</tr>
<tr>
<td>আঙ্গুর</td>
<td>15</td>
</tr>
<tr>
<td>কমলা</td>
<td>10</td>
</tr>
<tr>
<td>কলা</td>
<td>25</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>মোট</td>
<td>60</td>
</tr>
</tfoot>
</table>tbody - টেবিলের বডি তৈরি করার উদাহরণ।
html
<table border="1">
<thead>
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<thead>
<tbody>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</tbody>
</table>th - টেবিলে হেডার তৈরি করার উদাহরণ।
html
<table border="1">
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>caption - টেবিলের শিরোনাম নির্ধারণ করার উদাহরণ।
html
<table border='1'>
<caption>ব্যবহারকারীর তথ্য</caption>
<tr>
<th>আইডি</th>
<th>নাম</th>
<th>দেশ</th>
</tr>
<tr>
<td>10</td>
<td>তানিম</td>
<td>বাংলাদেশ</td>
</tr>
<tr>
<td>11</td>
<td>জোহান</td>
<td>নেদারল্যান্ড</td>
</tr>
<tr>
<td>12</td>
<td>হামিদ</td>
<td>আফগানিস্তান</td>
</tr>
<tr>
<td>13</td>
<td>সাকিব</td>
<td>বাংলাদেশ</td>
</tr>
</table>data - অবজেক্টে ডেটা রিসোর্স সংযুক্ত করার উদাহরণ।
html
<ul>
<li><data value="65000">আপেল</data></li>
<li><data value="15000">নকিয়া</data></li>
<li><data value="35000">নেক্সাস</data></li>
<li><data value="45000">হোনড়</data></li>
</ul>ul - আন অর্ডার তালিকা তৈরি করার উদাহরণ।
html
<ul>
<li>পিএইচপি</li>
<li>জাভা</li>
<li>পাইথন</li>
<li>জাভাস্ক্রিপ্ট</li>
</ul>nav - নেভিগেশন বার তৈরি করার উদাহরণ।
html
<nav>
<a href="#">পিএইচপি</a>
<a href="#">জাভা</a>
<a href="#">পাইথন</a>
<a href="#">জাভাস্ক্রিপ্ট</a>
</nav>ol - অর্ডার তালিকা তৈরি করার উদাহরণ।
html
<ol>
<li>পিএইচপি</li>
<li>জাভা</li>
<li>পাইথন</li>
<li>জাভাস্ক্রিপ্ট</li>
</ol>dl - বর্ণনার সংজ্ঞা তৈরি করার উদাহরণ।
html
<dl>
<dt>এইচটিএমএল টিউটোরিয়াল</dt>
<dd>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</dd>
<dt>সিএসএস টিউটোরিয়াল</dt>
<dd>ক্যাসকেডিং স্টাইল শিট</dd>
</dl>dt - শিরোনাম নির্ধারণ করার উদাহরণ।
html
<dl>
<dt>এইচটিএমএল টিউটোরিয়াল</dt>
<dd>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</dd>
<dt>সিএসএস টিউটোরিয়াল</dt>
<dd>ক্যাসকেডিং স্টাইল শিট</dd>
</dl>dd - বর্ণনা নির্ধারণ করার উদাহরণ।
html
<dl>
<dt>এইচটিএমএল টিউটোরিয়াল</dt>
<dd>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</dd>
<dt>সিএসএস টিউটোরিয়াল</dt>
<dd>ক্যাসকেডিং স্টাইল শিট</dd>
</dl>li - তালিকা তৈরি করার উদাহরণ।
html
<ul>
<li>পিএইচপি</li>
<li>জাভা</li>
<li>পাইথন</li>
<li>জাভাস্ক্রিপ্ট</li>
</ul>u - আন্ডারলাইন টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><u>এইচটিএমএল</u> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>b - গাঢ় মোটা টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><b>এইচটিএমএল</b> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>i - ইটালিক টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><i>এইচটিএমএল</i> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>em - গুরুত্বপূর্ণ টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><em>এইচটিএমএল</em> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>small - ছোট টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><small>এইচটিএমএল</small> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>del - বাতিল টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><del>এইচটিএমএল</del> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>ins - সন্নিবেশ টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><ins>এইচটিএমএল</ins> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>sub - সাবস্ক্রিপ্টেড টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><sub>এইচটিএমএল</sub> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>sup - সুপারস্ক্রিপ্টেড টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><sup>এইচটিএমএল</sup> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>cite - উদ্ধৃতির উৎস নির্দেশ করার উদাহরণ।
html
<p><cite>এইচটিএমএল</cite> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>dfn - বর্ণনার সংজ্ঞা প্রদর্শন করার উদাহরণ।
html
<p><dfn>এইচটিএমএল</dfn> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>q - টেক্সটর মধ্যে উদ্ধৃতি প্রদর্শন করার উদাহরণ।
html
<p><q>এইচটিএমএল</q> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>s - স্ট্রাইকথ্রু টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><s>এইচটিএমএল</s> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>mark - হাইলাইট টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><mark>এইচটিএমএল</mark> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>span - বিঘত টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><span>এইচটিএমএল</span> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>strong - দৃঢ় টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><strong>এইচটিএমএল</strong> হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>abbr - সংক্ষিপ্ত শব্দের সম্পূর্ণ টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><abbr title="প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন"></abbr>এইচটিএমএল</p>blockquote - উদ্ধৃতি চিহ্নিত করার উদাহরণ।
html
<blockquote>
মনে রাখা উচিত - জীবনের প্রতিটি সময় অনেক গুরুত্বপূর্ণ
</blockquote>div - বিভাগ তৈরি করার উদাহরণ।
html
<div>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>address - ব্যক্তি বা প্রতিষ্ঠানের যোগাযোগের ডেটা প্রদর্শন করার উদাহরণ।
html
<address>
নাম: মোঃ আরিফ<br>
তথ্য<br>
স্বপ্ন: সফটওয়্যার ইঞ্জিনিয়ার<br>
দেশ: বাংলাদেশ
</address>wbr - শব্দ ভেঙে লাইন তৈরি করার উদাহরণ।
html
<p>প্রোগ্রামিং শিখুন<wbr>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>var - ভেরিয়েবল তৈরি করার উদাহরণ।
html
<p><var>a<var></p>param - প্যারামিটার নির্ধারণ করার উদাহরণ।
html
<object data="/videos/rain.mp4" type="video/mp4" width="300" height="400">
<param name="autoplay" value="true">
</object>script - জাভাস্ক্রিপ্ট কোড সংযুক্ত করার উদাহরণ।
html
<script>
document.write("হ্যালো বিশ্ব");
</script>noscript - নিষ্ক্রিয় স্ক্রিপ্ট করার উদাহরণ।
html
<script>
document.write("হ্যালো বিশ্ব");
</script>
<noscript>ব্রাউজারটি জাভাস্ক্রিপ্ট সমর্থন করে না</noscript>dialog - ডায়ালগ বক্স তৈরি করার উদাহরণ।
html
<dialog>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</dialog>header - হেডার শাখা তৈরি করার উদাহরণ।
html
<header>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</header>template - কনটেন্ট টেমপ্লেট তৈরি করার উদাহরণ।
html
<template>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</template>article - স্বতন্ত্র কনটেন্ট উপস্থাপনা করার উদাহরণ।
html
<article>
<h1>এইচটিএমএল টিউটোরিয়াল</h1>
<p>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>
</article>
<article>
<h1>সিএসএস টিউটোরিয়াল</h1>
<p>ক্যাসকেডিং স্টাইল শিট</p>
</article>footer - ফুটার সেকশন তৈরি করার উদাহরণ।
html
<footer>
<p>মোঃ আরিফ</p>
<p>বাংলাদেশ</p>
</footer>details - বিবরণ তৈরি করার উদাহরণ।
html
<details>
<summary>এইচটিএমএল</summary>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</details>summary - বিবরণের সারাংশ তৈরি করার উদাহরণ।
html
<details>
<summary>প্রোগ্রামিং শিখুন</summary>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</details>aside - পার্শ্ববর্তী কনটেন্ট তৈরি করার উদাহরণ।
html
<aside>
<ul>
<li>পিএইচপি</li>
<li>জাভা</li>
<li>পাইথন</li>
<li>জাভাস্ক্রিপ্ট</li>
</ul>
</aside>main - প্রধান বিভাগ তৈরি করার উদাহরণ।
html
<main>
<h1>প্রোগ্রামিং শিখুন</h1>
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
<article>
<h1>এইচটিএমএল টিউটোরিয়াল</h1>
<p>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>
</article>
<article>
<h1>সিএসএস টিউটোরিয়াল</h1>
<p>ক্যাসকেডিং স্টাইল শিট</p>
</article>
</main>section - কনটেন্ট সেকসন তৈরি করার উদাহরণ।
html
<section>
<h1>এইচটিএমএল টিউটোরিয়াল</h1>
<p>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>
</section>
<section>
<h1>সিএসএস টিউটোরিয়াল</h1>
<p>ক্যাসকেডিং স্টাইল শিট</p>
</section>search - ডেটা অনুসন্ধান করার উদাহরণ।
html
<search>
<form>
<input name="fsrch" id="fsrch" placeholder="সার্চ">
</form>
</search>hgroup - শিরোনাম দলবদ্ধ করার উদাহরণ।
html
<hgroup>
<h1>এইচটিএমএল টিউটোরিয়াল</h1>
<p>হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ</p>
</hgroup>
<hgroup>
<h1>সিএসএস টিউটোরিয়াল</h1>
<p>ক্যাসকেডিং স্টাইল শিট</p>
</hgroup>h1 - সবচেয়ে বড় শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h1>প্রোগ্রামিং শিখুন</h1>h2 - দ্বিতীয় বৃহত্তম শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h2>প্রোগ্রামিং শিখুন</h2>h3 - তৃতীয় বৃহত্তম শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h3>প্রোগ্রামিং শিখুন</h3>h4 - চতুর্থ বৃহত্তম শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h4>প্রোগ্রামিং শিখুন</h4>h5 - পঞ্চম বৃহত্তম শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h5>প্রোগ্রামিং শিখুন</h5>h6 - সবচেয়ে ছোট শিরোনাম প্রদর্শন করার উদাহরণ।
html
<h6>প্রোগ্রামিং শিখুন</h6>p - অনুচ্ছেদ প্রদর্শন করার উদাহরণ।
html
<p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>a - হাইপারলিঙ্ক তৈরি করার উদাহরণ।
html
<a href="/index.php">লার্নউইজ</p>time - সময় প্রদর্শন করার উদাহরণ।
html
<p><time>10:00</time></p>samp - নমুনা টেক্সট প্রদর্শন করার উদাহরণ।
html
<p><samp>relode F1</samp></p>kbd - কীবোর্ড টেক্সট প্রদর্শন করার উদাহরণ।
html
<p>কপি <kbd>Ctrl</kbd> + <kbd>C</kbd> </p>
<p>সেভ করুন <kbd>Ctrl</kbd> + <kbd>S</kbd> </p>bdo - টেক্সটের দিক পরিবর্তন করার উদাহরণ।
html
<p><bdo dir="rtl">প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</bdo></p>bdi - বিভিন্ন ভাষা প্রদর্শনের দিক ঠিক রাখার উদাহরণ।
html
<p>নাম: <bdi>tanim</bdi></p>pre - পূর্বনির্ধারিত টেক্সট প্রদর্শন করার উদাহরণ।
html
<pre>
body {
background-color: blue;
color: black;
}
</pre>code - প্রোগ্রামিং কোড প্রদর্শন করার উদাহরণ।
html
<pre><code>
body {
background-color: blue;
color: black;
}
</code></pre>embed - ফাইল সংযোগ স্থাপন করার উদাহরণ।
html
<embed src="/images/author.jpg" alt="মোঃ আরিফ" height="200" width="300"></embed>object - ফাইল সংযোগ সংযুক্ত করার উদাহরণ।
html
<object data="/images/home.svg" height="50" width="50"></object>meter - পরিমাপ তৈরি করার উদাহরণ।
html
<meter min="0" max="100" value="60"></meter>progress - কোনো কাজের অগ্রগতি প্রদর্শন উদাহরণ।
html
<progress min="0" max="100" value="60"></progress>input - ডেটা গ্রহন করার উদাহরণ।
html
<form>
<label>আপনার নাম</label>
<input type="text" name="land">
<input type="submit" name="submit" value="সেভ করুন">
</form>form - ফর্ম তৈরি করার উদাহরণ।
html
<form action="index.php" method="post">
<label>আপনার নাম</label>
<input type="text" name="name"><br><br>
<label>আপনার দেশ</label>
<input type="text" name="land"><br><br>
<input type="submit" name="submit" value="সেভ করুন">
</form>output - কার্যকর ফলাফল প্রদর্শন করার উদাহরণ।
html
<form oninput="total.value = quantity.value * 10">
<label>পরিমাণ</label>
<input type="number" name="quantity" value="1" min="1"><br>
<label>মোট</label>
<output name="total">10</output> BDT
</form>fieldset - ফর্মের সীমানা তৈরি করার উদাহরণ।
html
<fieldset>
<form>
<label>আপনার নাম</label>
<input type="text" name="name"><br><br>
<label>আপনার দেশ</label>
<input type="text" name="land"><br><br>
<input type="submit" name="submit" value="সেভ করুন">
</form>
</fieldset>legend - ফর্মের উপকথা সেট করার উদাহরণ।
html
<fieldset>
<legend>আপনার মন্তব্য লিখুন</legend>
<form>
<label>আপনার নাম</label>
<input type="text" name="name"><br><br>
<label>আপনার দেশ</label>
<input type="text" name="land"><br><br>
<input type="submit" name="submit" value="সেভ করুন">
</form>
</fieldset>datalist - ডেটা তালিকা তৈরি করার উদাহরণ।
html
<form>
<label>একটি দেশ নির্বাচন করুন</label><br>
<input list="countries" name="country">
<datalist id="countries">
<option value="বাংলাদেশ">
<option value="নেদারল্যান্ড">
<option value="আফগানিস্তান">
</datalist><br><br>
<input type="submit" name="submit" value="সাবমিট">
</form>select - মান নির্বাচন করার উদাহরণ।
html
<select>
<option value="বাংলাদেশ">বাংলাদেশ</option>
<option value="নেদারল্যান্ড">নেদারল্যান্ড</option>
<option value="আফগানিস্তান">আফগানিস্তান</option>
</select>label - বর্ণনা সেট করার উদাহরণ।
html
<form>
<label>আপনার নাম</label><br>
<input type="text" name="name">
</form>optgroup - দলবদ্ধ অপশন তৈরি করার উদাহরণ।
html
<optgroup label="ফ্রন্টএন্ড">
<option>এইচটিএমএল</option>
<option>সিএসএস</option>
</optgroup>
<optgroup label="ব্যাকএন্ড">
<option>পিএইচপি</option>
<option>জাভা</option>
<option>পাইথন</option>
<option>জাভাস্ক্রিপ্ট</option>
</optgroup>option - অপশন তৈরি করার উদাহরণ।
html
<select>
<option value="বাংলাদেশ">বাংলাদেশ</option>
<option value="নেদারল্যান্ড">নেদারল্যান্ড</option>
<option value="আফগানিস্তান">আফগানিস্তান</option>
</select>textarea - ডেটা গ্রহন করার উদাহরণ।
html
<textarea rows="10" cols="20">
তথ্য জমা দিন
</textarea>audio - ওয়েব পেজে অডিও ফাইল সংযুক্ত করার উদাহরণ।
html
<audio controls>
<source src="music.mp3" type="audio/mp3">
</audio>video - ওয়েব পেজে ভিডিও ফাইল সংযুক্ত করার উদাহরণ।
html
<video height="400" width="300" controls>
<source src="/videos/rain.mp4" type="video/mp4">
</video>source - ফাইল সংযুক্ত করার উদাহরণ।
html
<video height="400" width="300" controls>
<source src="/videos/rain.mp4" type="video/mp4">
</video>track - টেক্সট ট্র্যাক তৈরি করার উদাহরণ।
html
<video height="400" width="300" controls>
<source src="/videos/rain.mp4" type="video/mp4">
<track kind="subtitles" srclang="en" label="English">
</video>এইচটিএমএল ট্যাগ সম্পর্কিত বিস্তারিত তথ্য
কার্যকর কোডিং উদাহরণ এবং সেগুলোর রেফারেন্স লিংক
| নাম | বিবরণ |
|---|---|
| doctype | ডকুমেন্ট ঘোষণা করতে ব্যবহৃত হয়। |
| html | ওয়েব পৃষ্ঠার কাঠামো তৈরি করতে ব্যবহৃত হয়। |
| head | মেটা-ডেটা সংরক্ষণ করতে ব্যবহৃত হয়। |
| title | এলিমেন্টে টাইটেট নির্ধারণ করতে ব্যবহৃত হয়। |
| link | ফাইল লিংক সংযুক্ত করতে ব্যবহৃত হয়। |
| base | ডিফল্ট উআরএল নির্ধারণ করতে ব্যবহৃত হয়। |
| meta | মেটা ডেটা সংরক্ষণ করতে ব্যবহৃত হয়। |
| body | ওয়েবপেজের দৃশ্যমান অংশ প্রদর্শন করতে ব্যবহৃত হয়। |
| hr | অনুভূমিক রেখা তৈরি করতে ব্যবহৃত হয়। |
| br | নতুন লাইন তৈরি করতে ব্যবহৃত হয়। |
| menu | মেনু তৈরি করতে ব্যবহৃত হয়। |
| table | টেবিল উপস্থাপনা তৈরি করতে ব্যবহৃত হয়। |
| colgroup | টেবিল কলাম দলবদ্ধ করতে ব্যবহৃত হয়। |
| col | টেবিল কলাম নির্ধারণ করতে ব্যবহৃত হয়। |
| tr | টেবিলের সারি তৈরি করতে ব্যবহৃত হয়। |
| td | টেবিলের বর্ণনা তৈরি করতে ব্যবহৃত হয়। |
| tfoot | টেবিলের পদপৃষ্ঠ তৈরি করতে ব্যবহৃত হয়। |
| thead | টেবিলের হেড তৈরি করতে ব্যবহৃত হয়। |
| tbody | টেবিলের বডি তৈরি করতে ব্যবহৃত হয়। |
| th | টেবিলে হেডার তৈরি করতে ব্যবহৃত হয়। |
| caption | টেবিলের শিরোনাম নির্ধারণ করতে ব্যবহৃত হয়। |
| data | অবজেক্টে ডেটা রিসোর্স সংযুক্ত করতে ব্যবহৃত হয়। |
| ul | আন অর্ডার তালিকা তৈরি করতে ব্যবহৃত হয়। |
| nav | নেভিগেশন বার তৈরি করতে ব্যবহৃত হয়। |
| ol | অর্ডার তালিকা তৈরি করতে ব্যবহৃত হয়। |
| dl | বর্ণনার সংজ্ঞা তৈরি করতে ব্যবহৃত হয়। |
| dt | শিরোনাম নির্ধারণ করতে ব্যবহৃত হয়। |
| dd | বর্ণনা নির্ধারণ করতে ব্যবহৃত হয়। |
| li | তালিকা তৈরি করতে ব্যবহৃত হয়। |
| u | আন্ডারলাইন টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| b | গাঢ় মোটা টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| i | ইটালিক টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| em | গুরুত্বপূর্ণ টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| small | ছোট টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| del | বাতিল টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| ins | সন্নিবেশ টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| sub | সাবস্ক্রিপ্টেড টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| sup | সুপারস্ক্রিপ্টেড টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| cite | উদ্ধৃতির উৎস নির্দেশ করতে ব্যবহৃত হয়। |
| dfn | বর্ণনার সংজ্ঞা প্রদর্শন করতে ব্যবহৃত হয়। |
| q | টেক্সটর মধ্যে উদ্ধৃতি প্রদর্শন করতে ব্যবহৃত হয়। |
| s | স্ট্রাইকথ্রু টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| mark | হাইলাইট টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| span | বিঘত টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| strong | দৃঢ় টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| abbr | সংক্ষিপ্ত শব্দের সম্পূর্ণ টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| blockquote | উদ্ধৃতি চিহ্নিত করতে ব্যবহৃত হয়। |
| div | বিভাগ তৈরি করতে ব্যবহৃত হয়। |
| address | ব্যক্তি বা প্রতিষ্ঠানের যোগাযোগের ডেটা প্রদর্শন করতে ব্যবহৃত হয়। |
| wbr | শব্দ ভেঙে লাইন তৈরি করতে ব্যবহৃত হয়। |
| var | ভেরিয়েবল তৈরি করতে ব্যবহৃত হয়। |
| param | প্যারামিটার নির্ধারণ করতে ব্যবহৃত হয়। |
| script | জাভাস্ক্রিপ্ট কোড সংযুক্ত করতে ব্যবহৃত হয়। |
| noscript | নিষ্ক্রিয় স্ক্রিপ্ট করতে ব্যবহৃত হয়। |
| dialog | ডায়ালগ বক্স তৈরি করতে ব্যবহৃত হয়। |
| header | হেডার শাখা তৈরি করতে ব্যবহৃত হয়। |
| template | কনটেন্ট টেমপ্লেট তৈরি করতে ব্যবহৃত হয়। |
| article | স্বতন্ত্র কনটেন্ট উপস্থাপনা করতে ব্যবহৃত হয়। |
| footer | ফুটার সেকশন তৈরি করতে ব্যবহৃত হয়। |
| details | বিবরণ তৈরি করতে ব্যবহৃত হয়। |
| summary | বিবরণের সারাংশ তৈরি করতে ব্যবহৃত হয়। |
| aside | পার্শ্ববর্তী কনটেন্ট তৈরি করতে ব্যবহৃত হয়। |
| main | প্রধান বিভাগ তৈরি করতে ব্যবহৃত হয়। |
| section | কনটেন্ট সেকসন তৈরি করতে ব্যবহৃত হয়। |
| search | ডেটা অনুসন্ধান করতে ব্যবহৃত হয়। |
| hgroup | শিরোনাম দলবদ্ধ করতে ব্যবহৃত হয়। |
| h1 | সবচেয়ে বড় শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| h2 | দ্বিতীয় বৃহত্তম শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| h3 | তৃতীয় বৃহত্তম শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| h4 | চতুর্থ বৃহত্তম শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| h5 | পঞ্চম বৃহত্তম শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| h6 | সবচেয়ে ছোট শিরোনাম প্রদর্শন করতে ব্যবহৃত হয়। |
| p | অনুচ্ছেদ প্রদর্শন করতে ব্যবহৃত হয়। |
| a | হাইপারলিঙ্ক তৈরি করতে ব্যবহৃত হয়। |
| time | সময় প্রদর্শন করতে ব্যবহৃত হয়। |
| samp | নমুনা টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| kbd | কীবোর্ড টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| bdo | টেক্সটের দিক পরিবর্তন করতে ব্যবহৃত হয়। |
| bdi | বিভিন্ন ভাষা প্রদর্শনের দিক ঠিক রাখতে ব্যবহৃত হয়। |
| pre | পূর্বনির্ধারিত টেক্সট প্রদর্শন করতে ব্যবহৃত হয়। |
| code | প্রোগ্রামিং কোড প্রদর্শন করতে ব্যবহৃত হয়। |
| embed | ফাইল সংযোগ স্থাপন করতে ব্যবহৃত হয়। |
| object | ফাইল সংযোগ সংযুক্ত করতে ব্যবহৃত হয়। |
| meter | পরিমাপ তৈরি করতে ব্যবহৃত হয়। |
| progress | কোনো কাজের অগ্রগতি প্রদর্শন ব্যবহৃত হয়। |
| input | ডেটা গ্রহন করতে ব্যবহৃত হয়। |
| form | ফর্ম তৈরি করতে ব্যবহৃত হয়। |
| output | কার্যকর ফলাফল প্রদর্শন করতে ব্যবহৃত হয়। |
| fieldset | ফর্মের সীমানা তৈরি করতে ব্যবহৃত হয়। |
| legend | ফর্মের উপকথা সেট করতে ব্যবহৃত হয়। |
| datalist | ডেটা তালিকা তৈরি করতে ব্যবহৃত হয়। |
| select | মান নির্বাচন করতে ব্যবহৃত হয়। |
| label | বর্ণনা সেট করতে ব্যবহৃত হয়। |
| optgroup | দলবদ্ধ অপশন তৈরি করতে ব্যবহৃত হয়। |
| option | অপশন তৈরি করতে ব্যবহৃত হয়। |
| textarea | ডেটা গ্রহন করতে ব্যবহৃত হয়। |
| audio | ওয়েব পেজে অডিও ফাইল সংযুক্ত করতে ব্যবহৃত হয়। |
| video | ওয়েব পেজে ভিডিও ফাইল সংযুক্ত করতে ব্যবহৃত হয়। |
| source | ফাইল সংযুক্ত করতে ব্যবহৃত হয়। |
| track | টেক্সট ট্র্যাক তৈরি করতে ব্যবহৃত হয়। |
| img | ছবি প্রদর্শন করতে ব্যবহৃত হয়। |
| iframe | আইফ্রেম তৈরি করতে ব্যবহৃত হয়। |
| canva | ক্যানভাস তৈরি করতে ব্যবহৃত হয়। |
| figure | চিত্র প্রদর্শন করতে ব্যবহৃত হয়। |
| figcaption | চিত্রের শিরোনাম নির্ধারণ করতে ব্যবহৃত হয়। |
| picture | ছবি প্রদর্শন করতে ব্যবহৃত হয়। |
| svg | এসভিজি গ্রাফিক্স তৈরি করতে ব্যবহৃত হয়। |
| circle | বৃত্ত তৈরি করতে ব্যবহৃত হয়। |