Sebelum membaca artikel ini bagi yang baru mempelajari cara
membuat tabel dengan HTML sebaiknya anda membaca lebih dulu mengenai cara membuat dan posting tabel dengan kode HTML agar nantinya bisa lebi jelas dalam mempelajari Cara mengatur teks rata kanan dan kiri pada tabel HTML.
Dalam menulis teks pada tabel pasti
kita menginginkan teks tersebut pada posisi rata tengah,
rata kiri atau rata kanan. Bahkan kita juga perlu untuk mengatur jarak dari tepi border dengan teks.
rata kiri atau rata kanan. Bahkan kita juga perlu untuk mengatur jarak dari tepi border dengan teks.
Nah lalu bagaimana agar keinginan kita terpenuhi ? Jangan khawatir semua
ada solusinya dan itu tidak sesulit yang kita bayangkan.
Untuk mengatur agar teks yang ditulis dalam
tabel sesuai dengan keinginan kita, perlu kode-kode tertentu antara lain :
- align : untuk mengatur perataan teks secara horisontal (mendatar)
- align = "left" : untuk mengatur teks rata kiri.
- align = "center" : untuk mengatur teks rata tengah.
- lign= "right" : untuk mengatur teks rata kanan.
- valign : untuk mengatur perataan teks secara vertikal (tegak).
- valign ="top" : untuk mengatur teks pada posisi atas.
- valign ="middle" : untuk mengatur teks pada posisi tengah.
- valign = "bottom" : untuk mengatur teks pada posisi bawah.
Cara mengatur teks rata kanan dan kiri pada tabel HTML.
Contoh kode HTML untuk membuat tabel yang didalamnya terdapat teks yang rata kiri, tengah dan kanan serta teks pada posisi atas, tengah dan bawah bisa anda lihat seperti di bawah.
Kodenya
:
<table
border="2" width="100%">
<tr
height="50px">
<td
align="left">RATA KIRI</td>
<td>TANPA
PERATAAN</td>
</tr>
<tr
height="50px">
<td
align="center">RATA TENGAH</td>
<td>TANPA
PERATAAN</td>
</tr>
<tr
height="50px">
<td
align="right">RATA KANAN</td>
<td>TANPA
PERATAAN</td>
</tr>
<tr
height="100px">
<td
align="left" valign="top">RATA KIRI dan RATA
ATAS</td>
<td>TANPA
PERATAAN</td>
</tr>
<tr
height="100px">
<td
align="left" valign="middle">RATA KIRI dan RATA TENGAH
(vertikal)</td>
<td>TANPA
PERATAAN</td>
</tr>
<tr
height="100px">
<td
align="left" valign="bottom">RATA KIRI dan RATA
BAWAH</td>
<td>TANPA
PERATAAN</td>
</tr>
</table>
Hasilnya :
RATA KIRI | TANPA PERATAAN |
RATA TENGAH | TANPA PERATAAN |
RATA KANAN | TANPA PERATAAN |
RATA KIRI posisi ATAS | TANPA PERATAAN |
RATA KIRI posisi TENGAH (vertikal) | TANPA PERATAAN |
RATA KIRI posisi BAWAH | TANPA PERATAAN |
terimakasih postingannya, sangat membantu ujian saya :)
BalasHapussehat selalu.
Untuk rata justify nya manaa???
BalasHapusOh... logo $ 200 logos.wapkiz.com
BalasHapus