ایچ ٹی ایم ایل میں ٹیبلز: ایچ ٹی ایم ایل میں ٹیبلز بنانے اور فارمیٹ کرنے کے لیے ایک گائیڈ

قطاروں اور کالموں کے ساتھ سٹرکچرڈ فارمیٹ میں ڈیٹا ڈسپلے کرنے کے لیے HTML میں ایک ٹیبل ایک لازمی جزو ہے۔ HTML میں، ٹیبلز کو <table>، <tr>، اور <td> ٹیگز کا استعمال کرتے ہوئے بنایا جاتا ہے۔

<table> ٹیگ مین ٹیبل کنٹینر کی نمائندگی کرتا ہے، جس میں تمام قطاریں اور کالم ہوتے ہیں۔ قطاروں کی وضاحت <tr>(ٹیبل قطار) ٹیگ کا استعمال کرتے ہوئے کی جاتی ہے، جب کہ قطاروں کے اندر موجود سیلز کی وضاحت <td>(ٹیبل ڈیٹا) ٹیگ کے ذریعے کی جاتی ہے۔ مزید برآں، آپ ٹیبل کے لیے ہیڈر سیلز کی وضاحت کے لیے <th>(ٹیبل ہیڈر) ٹیگ استعمال کر سکتے ہیں۔

آپ ٹیبل میں سیلز یا اسپین سیلز کو متعدد قطاروں اور کالموں میں ضم کرنے کے لیے colspan اور rowspan جیسی صفات استعمال کر سکتے ہیں۔ مزید برآں، آپ ٹیبل کی ظاہری شکل اور ترتیب کو اپنی مرضی کے مطابق بنانے کے لیے CSS کی خصوصیات کا اطلاق کر سکتے ہیں۔

 

ٹیبل( <table>)

- <table> عنصر کو HTML میں ٹیبل بنانے کے لیے استعمال کیا جاتا ہے۔

- ڈیٹا قطاروں( <tr>) اور کالموں( <td> یا <th>) میں رکھا جاتا ہے۔

- ہر ڈیٹا سیل <td>(ڈیٹا سیل) یا <th>(ہیڈر سیل) عناصر کے اندر رکھا جاتا ہے۔

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <tr>  
    <td>1</td>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
    <td>30</td>  
  </tr>  
</table>  

 

کالم ہیڈر( <th>)

- <th> عنصر کو ٹیبل میں کالم ہیڈر بنانے کے لیے استعمال کیا جاتا ہے۔

- عام طور پر میز کی پہلی قطار میں رکھا جاتا ہے۔

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <!-- data rows -->  
</table>  

 

ڈیٹا کی قطاریں( <tr>):

- <tr> عنصر کو ٹیبل میں ڈیٹا کی قطاریں بنانے کے لیے استعمال کیا جاتا ہے۔

- ڈیٹا سیل( <td>) یا ہیڈر سیل( <th>) ان <tr> عناصر کے اندر رکھے گئے ہیں۔

<table>  
  <tr>  
    <th>No.</th>  
    <th>Name</th>  
    <th>Age</th>  
  </tr>  
  <tr>  
    <td>1</td>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
    <td>30</td>  
  </tr>  
</table>  

 

کالم پھیلانا( colspan)

انتساب colspan کا استعمال کالموں کی تعداد کا تعین کرنے کے لیے کیا جاتا ہے جو ڈیٹا سیل یا ہیڈر سیل ٹیبل میں پھیلے گا۔

<table>  
  <tr>  
    <th colspan="2">Personal Information</th>  
  </tr>  
  <tr>  
    <td colspan="2">John Doe</td>  
  </tr>  
</table>  

 

قطار پھیلانا( rowspan)

انتساب rowspan کا استعمال قطاروں کی تعداد کا تعین کرنے کے لیے کیا جاتا ہے جو ڈیٹا سیل یا ہیڈر سیل ٹیبل میں پھیلے گی۔

<table>  
  <tr>  
    <th rowspan="2">No.</th>  
    <td>1</td>  
    <td>John</td>  
  </tr>  
  <tr>  
    <td>2</td>  
    <td>Jane</td>  
  </tr>  
</table>  

 

خلیات کو ضم کرنا( colspan اور rowspan)

آپ ٹیبل میں سیلز کو ضم کرنے کے لیے دونوں colspan اور انتسابات کو یکجا کر سکتے ہیں۔ rowspan

<table>  
  <tr>  
    <th rowspan="2">No.</th>  
    <th colspan="2">Personal Information</th>  
  </tr>  
  <tr>  
    <td>John</td>  
    <td>25</td>  
  </tr>  
</table>  

 

border جائیداد

- border پراپرٹی ٹیبل بارڈر کی موٹائی کی وضاحت کرتی ہے۔

- کی قدر border ایک غیر منفی عدد ہے۔

<table border="1">  
<!-- Table rows and columns -->  
</table>  

 

cellpadding جائیداد

-، cellpadding پراپرٹی ٹیبل میں سیل کے مواد اور سیل کی سرحد کے درمیان فاصلہ بتاتی ہے۔

- کی قدر cellpadding ایک غیر منفی عدد ہے۔

<table cellpadding="5">  
<!-- Table rows and columns -->  
</table>  

 

cellspacing جائیداد

- cellspacing پراپرٹی ٹیبل میں خلیوں کے درمیان وقفہ کاری کی وضاحت کرتی ہے۔

- کی قدر cellspacing ایک غیر منفی عدد ہے۔

<table cellspacing="10">  
<!-- Table rows and columns -->  
</table>  

 

یہ صفات اور عناصر آپ کو اپنی ضروریات کے مطابق HTML میں ٹیبل بنانے اور اپنی مرضی کے مطابق کرنے کی اجازت دیتے ہیں۔ آپ اپنی ویب سائٹ پر ڈیٹا کو واضح اور منظم انداز میں ظاہر کرنے کے لیے ان کا استعمال کر سکتے ہیں۔