Scribd Logo
Upload

Welcome to Scribd!

  • Petemuan 4 Web Desain

    Uploaded by

    hardiyanto
    6 views8 pages
    petemuan 4 web desain

    Original Title

    petemuan 4 web desain

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    petemuan 4 web desain

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    6 views8 pages

    Petemuan 4 Web Desain

    Uploaded by

    hardiyanto
    petemuan 4 web desain

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 8

    TABEL pada HTML

    Tabel digunakan untuk menyajikan data dalam bentuk kolom dan baris. Umumnya setiap kolom
    menunjukkan data yang sejenis, dan setiap baris yang terdiri atas kolom-kolom menunjukkan kelompok
    data dalam satu kesatuan. Tabel Menampilkan data yang tabular, sama seperti membuat tabel di
    micosoft word dan lainnya

    Struktur tabel

    Baris 1, Kolom 1 Baris 1, Kolom 2

    Baris 2, Kolom 1 Baris 2, Kolom 2

    Jika dilihat dari gambar diatas, menunjukan terdapat 2 baris, 2 kolom, 4 cell/ data. Sebuah tabel
    mempunyai judul, tempat anda menjelaskan kolom/baris yang dilibatkan, baris untuk informasi dan sel
    untuk setiap itemnya.

    Pada tabel dibawah ini, baris pertama berisi informasi header, yaitu nama depan & nama Belakang,
    Pada tabel dibawah ini, kolom pertama dan baris pertama berisi informasi header,

    Tag Tabel

    Sama seperti yang lain tabel juga mempunyai tag tag tertentu untuk menampilkan dalam HTML. setiap
    baris dan kolom menjelaskan sebuah tag tabel HTML dan setiap sel berisi sebuah pasangan tag atau
    penjelasan dari fungsi tag.

    ELEMEN TABEL PENJELASAN

    <TABLE>…</TABLE> Mendefenisikan sebuah tabel dalam HTML jika atribut border dituliskan,
    maka browser akan menampilkan tabel dengan border
    <TR>...</TR> Menspesifikasikan sebuah baris tabel dalam tabel. Anda dapat
    mendefinisikan atribut untuk seluruh baris: align(left,enter, right)
    dan/atau valign (top,middle,bottom).
    <TD>…</TD> Mendefinisikan sebuah sel data tabel. Secara default teks dalam sel ini
    ditampilkan rata kiri, dan ditengah secara vertikal. Sel data table dapat
    berisi atribut untuk mendefinisikan karakteristik dari sel dan isinya.
    <TH>…</TH> Mendefiniskan sel header tabel. Secara default teks dalam sel ini
    ditebalkan dan ditampilkan di tengah
    Tulislah Skrip Dibawah ini

    <HTML>
    <head>
    <title>Tabel pada HTML</title>
    </head>
    <body>
    <h1>Tabel Pada HTML</h1>
    <P>Setiap tabel dimulai dengan sebuah tag table.<BR>
    Setiap baris dimulai dengan sebuah tag tr.<BR>
    Setiap data dimulai dengan sebuah tag td.</P>
    <H4>Satu Kolom:</H4>
    <table BORDER=1>
    <tr>
    <td>Kolom 1</td>
    </tr>
    </table>
    <H4>Satu Baris dan Tiga Kolom:<H4>
    <table BORDER=1>
    <tr>
    <td>Kolom 1 </td>
    <td>Kolom 2 </td>
    <td>Kolom 3 </td>
    </tr>
    </table>
    <H4>Dua Baris Tiga Kolom:</H4>
    <table BORDER=1>
    <tr>
    <td>100</td>
    <td>200</td>
    <td>300</td>
    </tr>
    <tr>
    <td>400</td>
    <td>500</td>
    <td>600</td>
    </tr>
    </table>

    </body>
    </HTML>
    Atribut

    ATRIBUT TABEL PENJELASAN

    Border Mengatur ketebalan sisi pada tabel


    Cellspacing Mengatur jarak antar cell,
    cellpadding Mengatur jarak dari data/text ke border.
    colspan Menggabungkan lebih dari dua kolom pada tabel
    rowspan Menggabungkan lebih dari dua baris pada tabel

    Atribut dengan Border

    <H4>Atribut dengan Border<H4>


    <table BORDER=1>
    <tr>
    <td>Kolom 1 </td>
    <td>Kolom 2 </td>
    <td>Kolom 3 </td>
    </tr>
    </table>

    Contoh :

    Atribut dengan cellpadding

    <H4>Atribut dengan cellpadding</H4>


    <table BORDER=1 cellpadding="10">
    <tr>
    <td>baris 1, kolom 1</td>
    <td>baris 1, kolom 2</td>
    <td>baris 1, kolom 3</td>
    </tr>
    <tr>
    <td>baris 2, kolom 1</td>
    <td>baris 2, kolom 2</td>
    <td>baris 3, kolom 3</td>
    </tr>
    </table>
    Atribut dengan cellspacing

    <H4>Atribut dengan cellspacing</H4>


    <table BORDER=1 cellspacing="10">
    <tr>
    <td>baris 1, kolom 1</td>
    <td>baris 1, kolom 2</td>
    <td>baris 1, kolom 3</td>
    </tr>
    <tr>
    <td>baris 2, kolom 1</td>
    <td>baris 2, kolom 2</td>
    <td>baris 3, kolom 3</td>
    </tr>
    </table>

    Colspan
    Latihan
    Form

    Form :

    You might also like