ဟတ္တိ လက္ခဏ္ <td> အမှတ္

  • ပြင္းပြင္းအခြေအား <tbody>
  • နောက်အခြေအား <template>

အသုံးပြုခြင်း နှင့် အပြုအရေး

<td> အချက်အလက် အချက်အလက် ကို အစားထိုးပါ (ကျွန်ပ်ဆိုင်ရာ)

HTML အချက်အလက် တစ်မျိုး ရှိသည်:

  • အချက်အလက် အချက်အလက် ကို အစားထိုးပါ (ကျွန်ပ်ဆိုင်ရာ) <th> အရာများ ဖွဲ့စည်းပါ
  • အချက်အလက် အချက်အလက် ကို အစားထိုးပါ (ကျွန်ပ်ဆိုင်ရာ) <td> အရာများ ဖွဲ့စည်းပါ

အခြေအနေ<td> အရာများ အတိုင်း အဆိုးအဆိုး ဖြစ်ပြီး အရှေ့ဘက် ပြောင်းလဲပါ

<th> အရာများ အတိုင်း အဆိုးအဆိုး ဖြစ်ပြီး အလတ်အလျှက် ပြောင်းလဲပါ

အခြား ကြည့်ရှုရန်

HTML အခွင့်အလမ်းဟတ္တိ လက္ခဏ္ အေဂျီ

HTML DOM အစီအစဉ်TableData အပေါ်

CSS အခွင့်အလမ်းအချက်အလက် အော်ဒါ ကို အစားထိုးပါ

အကျယ်အဝန်း

အမှတ် 1

အကျယ်အဝန်း ကြီးသော အခြေအနေ တင်ပြထားသော HTML အချက်အလက် တစ်ခု ရှိသည်။ နှစ်တန်း နှင့် အချက်အလက် လေးခု ရှိသည်:

<table>
  <tr>
    <td>အချက် A</td>
    <td>အချက် B</td>
  </tr>
  <tr>
    <td>အချက် C</td>
    <td>အချက် D</td>
  </tr>
</table>

亲自试一试

အမှတ် 2

ပြောင်းလဲခြင်း ဘယ်လိုဖြစ်သလဲ <td> အချက်အလက် (အစုံးရှိ စက်တင်ပုံ)

<table style="width:100%">
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr>
    <td>ဇွန်</td>
    <td style="text-align:right">￥3400</td>
  </tr>
  <tr>
    <td>ဖေဖော်ဝါရီ</td>
    <td style="text-align:right">￥4500</td>
  </tr>
</table>

亲自试一试

အမှတ် 3

အခြေအနေ ကို တင်ပြထားသော အော်ဒါ ကို အကြိမ်ဖြတ် ပြီး အသုံးပြုပါ (ကျွန်ပ်ဆိုင်ရာ CSS):

<table>
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr>
    <td style="background-color:#FF0000">ဇွန်</td>
    <td style="background-color:#00FF00">￥3400</td>
  </tr>
 </table>

亲自试一试

ဘားသီ 4

အချက်အလက် အားလုံး အထိပ်အဝန်း ကို စစ်ဆေးရန် ဘယ်လိုက်ရမလဲက်သင် (အစုံးရှိ စက်တင်ပုံ)

<table>
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr>
    <td style="height:100px">ဇွန်</td>
    <td style="height:100px">￥3400</td>
  </tr>
</table>

亲自试一试

ဘားသီ 5

အချက်အလက် အားလုံး ပြောင်းလဲခြင်း မပြုရန် ဘယ်လိုက်ရမလဲက်သင် (အစုံးရှိ စက်တင်ပုံ)

<table>
  <tr>
    <th>ရုပ်ရှင်</th>
  </tr>
  <tr>
    <td style="white-space:nowrap">朝辞白帝彩云间，千里江陵一日还。两岸猿声啼不住，轻舟已过万重山。</td>
  </tr>
</table>

亲自试一试

ဘားသီ 6

အားကြီးချင်း လက်ဆုံးရေးခြင်း <td> အချက်အလက် (အစုံးရှိ စက်တင်ပုံ)

<table style="width:50%;">
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr style="height:100px">
    <td style="vertical-align:bottom">ဇွန်</td>
    <td style="vertical-align:bottom">￥3400</td>
  </tr>
</table>

亲自试一试

ဘားသီ 7

အချက်အလက် အားလုံး အကျယ်အဝန်း ကို စစ်ဆေးရန် ဘယ်လိုက်ရမလဲက်သင် (အစုံးရှိ စက်တင်ပုံ)

<table style="width:100%">
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr>
    <td style="width:70%">ဇွန်</td>
    <td style="width:30%">￥3400</td>
  </tr>
</table>

亲自试一试

ဘားသီ 8

ဘယ်လိုက်ရမလဲက်သင် အချက်အလက် ခေါင်းစဉ် ကို ဖွဲ့စည်းရန်?

<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>

亲自试一试

ဘားသီ 9

ခေါင်းစဉ် ပါဝင်သော အချက်အလက် ပုံများ ကို ဘယ်လိုက်ရမလဲက်သင်?

<table>
  <caption>လပ် သယ်ပိုင်း</caption>
  <tr>
    <th>လပ်</th>
    <th>သယ်ပိုင်း</th>
  </tr>
  <tr>
    <td>ဇွန်</td>
    <td>￥3400</td>
  </tr>
  <tr>
    <td>ဖေဖော်ဝါရီ</td>
    <td>￥4500</td>
  </tr>
</table>

亲自试一试

ဘားသီ 10

သို့မဟုတ် မျက်နှာချင်း သို့မဟုတ် စတုရန်းများ ကို အခြေချ အပ်ခြင်း သတ်မှတ် ရန် ဘယ်လိုက်ရမလဲက်သင်?

<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>

亲自试一试

属性

属性 值 描述
colspan အခြား အခြေအား ကြိုးခဲ့ အိမ်နီ ကြိုးခဲ့ အခြေအား
headers header_id ကိုယူပါ အခြေအား
rowspan အခြား အခြေအား အောက္မဲ့ အိမ်နီ ကြိုးခဲ့ အခြေအား

ကိုယ်ပိုင္း အခြေအား

<td> အခြား အခမ်းအသား HTML ကိုယ်ပိုင္း အခြေအား

အခမ်းအသား အခြေအား

<td> အခြား အခမ်းအသား HTML အခမ်းအသား အခြေအား

အခြေအား အခြေအား

အခြား ဘာသာစကား မျိုးခြား ဘာသာစကား အခြေအား <td> အီအီအီ

td {
  display: table-cell;
  vertical-align: inherit;
}

ဘာသာစကား အခြေအား

အီီအီ အေအိုင္ အီက္ဂက္ အာဟား အာပူ္
အီီအီ အေအိုင္ အီက္ဂက္ အာဟား အာပူ္
ထောက္ပံ့ ထောက္ပံ့ ထောက္ပံ့ ထောက္ပံ့ ထောက္ပံ့
  • ပြင္းပြင္းအခြေအား <tbody>
  • နောက်အခြေအား <template>