HTML <tr> टैग

  • पिछला पृष्ठ <title>
  • अगला पृष्ठ <track>

परिभाषा और उपयोग

<tr> टैग को विभाजित करता है।

<tr> एलीमेंट एक या अधिक <th> या <td> एलीमेंट

अन्य संदर्भ

HTML शिक्षणHTML तालिका

HTML DOM संदर्भ निर्देशिकाTableRow ऑब्जेक्ट

CSS शिक्षणतालिका शैली निर्धारित करें

उदाहरण

उदाहरण 1

एक साधारण तीन पट्टी वाली HTML तालिका; एक शीर्षक पट्टी और दो डाटा पट्टियाँ:

<table>
  <tr>
    <th>महीना</th>
    <th>बचत</th>
  </tr>
  <tr>
    <td>जनवरी</td>
    <td>₹3400</td>
  </tr>
  <tr>
    <td>फरवरी</td>
    <td>₹4500</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

उदाहरण 2

कैसे जस्ता दें: <tr> के अंदर की सामग्री (CSS के उपयोग से):

<table style="width:100%">
  <tr>
    <th>महीना</th>
    <th>बचत</th>
  </tr>
  <tr style="text-align:right">
    <td>जनवरी</td>
    <td>₹3400</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

उदाहरण 3

कैसे तालिका पट्टी को पृष्ठभूमि रंग जोड़ा जाता है (CSS के उपयोग से):

<table>
  <tr style="background-color:#FF0000">
    <th>महीना</th>
    <th>बचत</th>
  </tr>
  <tr>
    <td>जनवरी</td>
    <td>₹3400</td>
  </tr>
 </table>

स्वयं एक प्रयोग कीजिए

उदाहरण 4

कैसे अग्रस्थान प्रारूप दें: <tr> के अंदर की सामग्री (CSS के उपयोग से):

<table style="height:200px">
  <tr  style="vertical-align:top">
    <th>महीना</th>
    <th>बचत</th>
  </tr>
  <tr style="vertical-align:bottom">
    <td>जनवरी</td>
    <td>₹3400</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

उदाहरण 5

तालिका शीर्षक कैसे बनाया जाता है:

<table>
  <tr>
    <th>नाम</th>
    <th>ईमेल</th>
    <th>टेलीफोन</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>bill.gates@example.com</td>
    <td>138-1234-5678</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

उदाहरण 6

कैसे शीर्षक वाली तालिका बनाई जाती है:

<table>
  <caption>महीना बचत</caption>
  <tr>
    <th>महीना</th>
    <th>बचत</th>
  </tr>
  <tr>
    <td>जनवरी</td>
    <td>₹3400</td>
  </tr>
  <tr>
    <td>फरवरी</td>
    <td>₹4500</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

उदाहरण 7

बहुपट्टी या बहुस्तम्भ के तालिका को विभाजित करने के लिए कैसे परिभाषित किया जाता है:

<table>
  <tr>
    <th>नाम</th>
    <th>ईमेल</th>
    <th colspan="2">फोन</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>bill.gates@example.com</td>
    <td>138-1234-5678</td>
    <td>186-2345-6789</td>
  </tr>
</table>

स्वयं एक प्रयोग कीजिए

वैश्विक प्रकृति

<tr> टैग इवेंट प्रकृति का समर्थन करता है HTML में वैश्विक प्रकृति।

इवेंट प्रकृति

<tr> टैग इवेंट प्रकृति का समर्थन करता है HTML में इवेंट प्रकृति।

डिफॉल्ट CSS सेटिंग

अधिकांश ब्राउज़र निम्नलिखित डिफॉल्ट मूल्यों को प्रदर्शित करेंगे <tr> एलीमेंट:

tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit;
}

ब्राउज़र समर्थन

च्रोम एज फायरफॉक्स सैफारी ओपेरा
च्रोम एज फायरफॉक्स सैफारी ओपेरा
सापोर्ट सापोर्ट सापोर्ट सापोर्ट सापोर्ट
  • पिछला पृष्ठ <title>
  • अगला पृष्ठ <track>