ITI COPA

HTML THEORY - LIST AND TABLE TAGS

HTML – लिस्ट एवं टेबल टैग्स

List Tag : List टैग के द्वारा HTML Document में Lists बनाई जाती है। इन टैग्स की सहायता से Number Lists, Bullet Lists, Order Lists, Unorder Lists और Definition Lists बना सकते है।  महत्वपूर्ण टैग निम्नानुसार हैं :
Tag
विवरण
उदाहरण
<ul>  
<ul> Element का पूरा नाम Unorder List होता है। इसके  द्वारा Bullet Lists या Unorder Lists बनाई जाती है। अनआर्डर लिस्ट निम्नानुसार प्रदर्शित होती है ।
·        Coffee
·        Tea
·        Milk
<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>
<ol>  
<ol> Element का पूरा नाम Order List होता है। इसके द्वारा Number या Order Lists बनाई जाती है।
आर्डर लिस्ट निम्नानुसार प्रदर्शित होती है ।
1.   Coffee
2.   Tea
3.   Milk
<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
<li> 
<li> Element का पूरा नाम List Item होता है। इसके द्वारा एक List में लिखे जाने वाले Data को Define किया जाता है।
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
<dl> 
<dl> Element का पूरा नाम Description List होता है। इसके  द्वारा विवरण सूची को परिभाषित किया जाता है।
<dl>
<dt> Coffee </dt>
<dd>- black hot drink </dd>
<dt> Milk </dt>
<dd> - white cold drink </dd>
</dl>
<dt> 
<dt> Element का पूरा नाम Description Term होता है। इसके  द्वारा शब्दों/नामों को परिभाषित किया जाता है
<dd> 
<dd> Element का पूरा नाम Description Definition होता है। एक <dd>टैग के अंदर आप पैराग्राफ, लाइन ब्रेक, छवियां, लिंक, सूचियां आदि डाल सकते हैं। <dd>टैग का उपयोग <dl> और <dt> के साथ संयोजन के रूप में किया जाता है।

Table Tag : टेबल टैग के द्वारा के द्वारा HTML Document में Table बनाने के लिए किया जाता है। Table से डाटा को Tabular Format में दर्शाया जाता है। महत्वपूर्ण टैग निम्नानुसार हैं :
Tag
विवरण
उदाहरण
<table> 
<table> Element से Table को Define किया जाता है।
<table>
  <tr>
    <th>Firstname </th>
    <th>Lastname </th>
    <th>Age </th>
  </tr>
  <tr>
    <td>ASHOK </td>
    <td>SHARMA </td>
    <td>20 </td>
  </tr>
  <tr>
    <td>BHANU </td>
    <td>PATEL </td>
    <td>24 </td>
  </tr>
</table>
<th> 
<th> Element का पूरा नाम Table Header होता है। इसके द्वारा Table Header यानि Cells को Define किया जाता है।
<tr> 
<tr> Element का पूरा नाम Table Row होता है। इसके द्वारा Table Row को Define किया जाता है।
<td> 
<td> Element का पूरा नाम Table Data होता है। इसके द्वारा Table Data को Define किया जाता है। यानि जो Data हम Table में लिखना चाहता है।
<caption> 
<caption> Element का उपयोग Table Caption / शीर्षक देने के लिए किया जाता है।
<table>
<caption> Monthly Savings </caption>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>January</td>
      <td>1000</td>
    </tr>
    <tr>
      <td>February</td>
      <td>1500</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>Sum</td>
      <td>2500</td>
    </tr>
  </tfoot>
</table>
<thead> 
<thead> Element का पूरा नाम Table Header होता है। इसके द्वारा Header Content का Group बनाया जाता है।
<tbody> 
<tbody> Element का पूरा नाम Table Body होता है। इसके द्वारा Table के Body Content को Group किया जाता है।
<tfoot> 
<tfoot> Element का पूरा नाम Table Footer होता है। इसके द्वारा Footer Content को Group किया जाता है।