HTML in Hindi – HTML Tables

  • Introduction to HTML Tables
  • Create a html table in Hindi
  • Details of HTML Table in Hindi

Introduction to HTML Tables

एक web page में किसी information को category wise दिखाने के लिये HTML tables का use किया जाता है। web page पर tables का use करके किसी भी information को दिखा सकते है |

HTML मे table create करने के लिए <table> tag का युज किया जाता है। इस tag का एक sub tag होता है जिसे <tr> tag कहते है या फिर table row कहते है। <tr> tag का भी sub tag होता है पहला <th> होता है जिसे heading के लिए use किया जाता है और दूसरा <td> होता है इसे table data के लिए use किया जाता है | <th>और <td> दोनों को table data कह सकते है |

Create a Table in HTML

HTML मे कोई भी table row और columns से मिलकर बना होता है। इसलिये <table> tag के बाद row create किया जाता है और row बनाने के लिए <tr> tag का युज कर सकते है । और जितना rows create करना चाहते है | हमे उतना बार <tr> tag create करना पड़ेगा |

Table Rows create करने के बाद आप rows के अन्दर columns भी create करते है। और Columns create करने के लिये <td> tag का use किया जाता है। और जितना columns create करना चाहते है हमे उतना बार <td> tag को create करना पड़ेगा | अब निचे दिये गये code को देखे |

<!DOCTYPE html>
<html>
<head>
       <title>Easy Hindi Tutorials</title>
</head>
<body>
<table border="1">
       
<tr>
       <th>Name</th>
       <th>Course</th>
       <th>Price</th>
       <th>Book</th>
</tr>
<tr>
       <td>Rahul Sahani</td>
       <td>BCA</td>
       <td>160000</td>
       <td>HTML</td>
</tr>
</table>
</body>
</html>

HTML में tables create करने के लिए सबसे पहले <table> tag को create किया जाता है। उसके बाद <tr> tag को create करते है | फिर बाद मे <th> या <td> tags create करते है। <th> और <td> tags हमेशा <tr> tags के अंदर आते है | ध्यान रहे <th> का use first row मे किया जाता है और हा जब तक border attribute का use नही करते है तब तक table पर border apply नहीं होता है।

HTML Table Attributes

html मे table तो आसानी से बना लेते है पर table को customize करने के लिए हमे table Attribute का use करना पड़ता है और table के सिर्फ दो ही Attributes होते है पहला rowspan और दूसरा colspan इन दोनों Attribute के मदत से हम table को customize कर सकते है |

Rowspan Attribute

Rowspan Attribute का use किन्ही दो rows को आपस मे मर्ज करने के लिए किया जाता है और हा सिर्फ दो rows ही नही आप यहाँ पर अपने according जितना row चाहे उतना rows आपस मे मर्ज कर सकते है अब निचे दिये गये code को देखे |

<!DOCTYPE html>
<html>
<head>
       <title>Easy Hindi Tutorials</title>
</head>
<body>
<table border="1">
       
<tr>
       <th rowspan="2">Name & Rahul Sahani</th>
       <th>Course</th>
       <th>Price</th>
       <th>Book</th>
</tr>
<tr>
       <td>BCA</td>
       <td>160000</td>
       <td>HTML</td>
</tr>
</table>
</body>
</html>

Colspan Attribute

जिस तरह rows को आपस मे मर्ज करने के लिए rows attribute का use किया जाता है ठीक उसी प्रकार से columns को मर्ज करने के लिए colspan attribute का use किया जाता है | बस difference केवल इतना है rowspan का use rows को मर्ज करने के लिए किया जाता है और colspan का use Columns को मर्ज करने के लिए किया जाता है | अब निचे दिये गये code को देखे और समझे |

<!DOCTYPE html>
<html>
<head>
       <title>Easy Hindi Tutorials</title>
</head>
<body>
<table border="1">
<tr>
       <th colspan="2">Name & Course</th>
       <th>Price</th>
       <th>Book</th>
</tr>
<tr>
       <td>Rahul Sahani</td>
       <td>BCA</td>
       <td>160000</td>
       <td>HTML</td>
</tr>
</table>
</body>
</html>

Caption Tag

Caption tag का use table को नाम देने के लिए किया जाता है और इस tag को हमेसा table tag के बाद तुरंत लिखा जाता है |

<!DOCTYPE html>
<html>
<head>
       <title>Easy Hindi Tutorials</title>
</head>
<body>
<table border="1">
       <caption>Easy Hindi Tutorials</caption>
<tr>
       <th colspan="2">Name & Course</th>
       <th>Price</th>
       <th>Book</th>
</tr>
<tr>
       <td>Rahul Sahani</td>
       <td>BCA</td>
       <td>160000</td>
       <td>HTML</td>
</tr>
</table>
</body>
</html>
HTML Fonts HTML Lists
Previous Next