"The HTML Playground: Your Coding Hub" Table Tag | Lecture 6 in Hindi / Urdu

Table Tag

Table tag

<Table>

HTML ke <table> tag ka use tabular data ko organize karne ke liye kiya jata hai. Is tag ka use HTML table banane ke liye kiya jata hai jisme row aur column ke through data display kiya jata hai.

HTML table me har table cell ko <td> tag ke andar define kiya jata hai, jise table data cell kaha jata hai. Iske alawa, table ke header row ke liye <th> tag ka use kiya jata hai, jise table header cell kaha jata hai.

Kuch common <table> tag ke attributes is tarah hai:

border: Ye attribute table ke border ke width ko set karta hai. Iske value me pixels specify kiya ja sakta hai.

cellpadding: Ye attribute table ke cells ke bich ka padding set karta hai. Iske value me pixels specify kiya ja sakta hai.

cellspacing: Ye attribute table cells ke bich ka spacing set karta hai. Iske value me pixels specify kiya ja sakta hai.

align: Ye attribute table ko align karne ke liye use kiya jata hai. Iske values "left", "center", or "right" ho sakte hain.

width: Ye attribute table ka width set karta hai. Iske value me pixels ya percentage specify kiya ja sakta hai.

Example:

<table border="1" cellpadding="5" cellspacing="0" align="center">
  <tr>
    <th>Name</th>
    <th>Age</th>
    <th>Gender</th>
  </tr>
  <tr>
    <td>John</td>
    <td>25</td>
    <td>Male</td>
  </tr>
  <tr>
    <td>Jane</td>
    <td>30</td>
    <td>Female</td>
  </tr>
</table>

Is example me, HTML table me <tr> (table row) ke through 3 rows banaye gaye hain aur har row me 3 cells (td) ko include kiya gaya hai. Pahli row me <th> tag ka use kiya gaya hai, jisme column headings include kiye gaye hain. Iske alawa, <table> tag ke kuch attributes ko bhi set kiya gaya hai.

Table Head Table Body Table Foot


HTML me <thead>, <tbody>, aur <tfoot> tags ka use tables ko organize karne ke liye kiya jata hai. Ye tags <table> tag ke andar use kiye jate hain.

<Thead>

Is tag ka use table ke header row ke liye kiya jata hai. Ye tag <tr> tag ke andar use kiya jata hai aur table ke first row me hi define kiya jata hai. <thead> tag ke andar <th> tag ka use kiya jata hai.

<Tbody>

Is tag ka use table ke data rows ke liye kiya jata hai. Ye tag bhi <tr> tag ke andar use kiya jata hai. Table ke sare data rows <tbody> tag ke andar define kiye jate hain. <tbody> tag ke andar <td> tag ka use kiya jata hai.

<Tfoot>

Is tag ka use table ke footer row ke liye kiya jata hai. Ye tag <tr> tag ke andar use kiya jata hai aur table ke last row me define kiya jata hai. <tfoot> tag ke andar <th> tag ka use kiya jata hai.

In tags ke use se HTML table ko logical sections me divide kiya jata hai. Ye tags table ko visually present karne se ziyada iske content ko logically divide karne aur organize karne me madad karte hain.

Example:

<table>
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th>Total</th>
      <td>$180</td>
    </tr>
  </tfoot>
</table>

Is example me, ek basic HTML table ko <thead>, <tbody>, aur <tfoot> tags ke sath organize kiya gaya hai. <thead> tag ke andar table ke header row ki headings, <tbody> tag ke andar table ke data rows, aur <tfoot> tag ke andar table ke footer row ke contents define kiye gaye hain.


umeed hai apko sare tags ache se samaj me aay hoge next lecture k liye humri blog ko follow karte rahe aur agar apko humara blog pasand aaya to apne dosto se bhi share kare. milte hai next lecture k liye tab tak k liye allahafiz

 

"HTML Unleashed: A Comprehensive Guide"
"Mastering HTML: From Basics to Beyond"
"HTML Essentials: Building the Web"
"HTML Demystified: Tag by Tag"
"The HTML Playground: Your Coding Hub"
"Unlocking the Web: HTML Explained"
"HTML Wizardry: Crafting Web Pages"
"HTML Insights: A Developer's Handbook"
"HTML Made Simple: Learn and Create"
"HTML Chronicles: Your Journey Begins Here"

 

"FOR MY CHANNEL" ❤️LIKE 💬COMMENT 🔗SHARE ❗🔥🔥🔥🔥SUBSCRIBE NOW 🔔PRESS THE BELL ICON FOR NOTIFICATION

 

 

Comments