Html5 form_ power node java college

Peran tabel ini adalah untuk menampilkan data dua dimensi. , itu akan diperkenalkan nanti). Berikut ini terutama memperkenalkan elemen HTML untuk membuat tabel.

Elemen dasar bentuk meliputi: Tabel, TR, dan TD.

Tabel mewakili tabel dalam dokumen HTML yang mendukung atribut perbatasan untuk menentukan lebar bingkai bingkai;

TR mewakili garis dalam tabel;

TD mewakili sel dalam tabel, termasuk atribut berikut:

1) Colspan: Jumlah kolom yang dapat dilintasi sel;

2) ROWSPAN: Jumlah baris yang dapat dilewati sel;

3) Header: Standar Head -terkait header sel.

 <able> <tr> <td> apel </td> <td> hijau </td> <td> medium </td> </tr> <td> jeruk </td> <td> oranye </td> <td> besar </td> </tr> </able>

Di atas mendefinisikan tabel dua baris dan tiga kolom.

Menggunakan atribut perbatasan elemen tabel dapat menambahkan batas ke tabel.

 <tabel border = 1> <tr> <td> apel </td> <td> green </td> </tdium </td> </tr> <td> jeruk </td> <td> oranye </ttr> td> <td> besar </td> </tr> </able>

Perbatasan default browser tidak terlalu indah, dan biasanya perlu menggunakan CSS untuk mengatur gaya bingkai untuk berbagai elemen.

Menggunakan atribut colspan dan rowspan sel dapat membangun tabel yang tidak teratur, sehingga beberapa baris atau kolom tabel span beberapa sel.

 <Border Table = 1> <ter> <t th> bulan </th> <t th> penghematan </th> </tr> <td colorpan = 2> Januari </td> </tr> <ter> <td colorpan = 2> Februari </td> </tr> </able>

Berikut ini adalah contoh sel yang melintasi beberapa baris:

 <Border Table = 1> <ter> <t th> bulan </t> <t th> penghematan </th> </tr> <td> Januari </td> <td> $ 100,00 </td> <td rowspan = 2> $ 50 </td> </tr> <td> Februari </td> <td> $ 10,00 </td> </able>

Elemen TH digunakan untuk menambahkan header ke formulir, yang dapat digunakan untuk membedakan data dan penjelasan data. Elemen ini mendukung atribut berikut:

1) Colspan: Jumlah kolom yang dapat dilintasi sel;

2) ROWSPAN: Jumlah baris yang dapat dilewati sel;

3) Lingkup: Tentukan metode mengaitkan data kepala dengan data unit;

3) HEADER: Daftar ID header yang dipisahkan oleh ruang disediakan dengan informasi header untuk sel data.

 <able> <ter> <t th> peringkat </th> <th> nama </th> <th> warna </th> </th> </tr> <th> favorit: tidak/td> <td> Oranye </td> <td> besar </td> </tr> <ter> <th> favorit ke-3: </th> <td> pomegraanate </td> <td> Semacam jenis merah hijau </sed </td> <td> Td> <td> bervariasi dari sedang hingga besar </td> </tr> </able>

TH dan TD dapat digunakan dalam satu baris.

Menggunakan atribut header TD dapat dikaitkan dengan sel. Atribut header dapat berupa nilai atribut ID dari satu atau lebih sel TH:

 <Tabel border = 1 lebar = 100%> <ter> <tH id = name> name </th> <tH id = email> email </th> <th id = phone> phone> Telepon </th> <th Id = address> alamat </t th> </tr> <ter> <td header = name> George Bush </td> <td headers = email> [email protected] </td> <td headers = phone> + + + 789451236 </td> <td header = alamat> Fifth Avenue New York, USA </td> </tr> </able>

Menggunakan colspan dan atribut rowspan dapat membangun tabel yang kompleks.

 <Border Table = 1> <tr> <th colspan = 2> Perusahaan di AS </t> </tr> <t th> nama </t> <t th> addr </th> </tr> <td > Apple, Inc. </td> <td> 1 Infinite Loop Cupertino, CA 95014 </td> </tr> <td> Google, Inc. </td> 1600 Amphitheatre Parkway Mountain View, CA 94043 </td> </tr> </able>

Anda dapat menggunakan elemen tobe, tbody dan tfoot untuk menambahkan struktur ke dalam bentuk, sehingga Anda dapat menambahkan gaya CSS ke setiap bagian dari bentuk untuk menjadi lebih mudah.

1) Tema tabel

Elemen tbody mewakili seluruh garis tema bentuk, tidak termasuk header (representasi elemen itu) dan skuter (representasi elemen tfoot).

Perhatikan bahwa sebagian besar browser akan secara otomatis memasukkan elemen TBody saat memproses elemen tabel.

2) Bentuk header

Elemen Thead digunakan untuk menandai garis judul formulir. Jika tidak ada elemen itu, semua elemen TR akan dianggap sebagai bagian dari subjek formulir.

3) Tambahkan catatan kaki

Elemen -elemen Tfoot digunakan untuk menandai garis pembentukan. Sebelum HTML5, elemen TFOOT hanya dapat muncul di hadapan elemen TBody, dan di HTML5, elemen TFOOT diizinkan untuk menempatkan elemen TFOOT setelah TBody.

Di bawah ini adalah contoh komprehensif, yang menggunakan elemen TBody, Thead, dan Tfoot.

 <able> <d> <ter> <t th> peringkat </th> <th> name </th> <th> warna </th> <th> ukuran </th> </thead> </Tead> < Tfoot> <ter> <t th> peringkat </t> <th> nama </th> <th> warna </th> </th> </tr> </tfoot> <tr> <ter> <t th> Favorit: <t th> <td> apel </td> <td> green </td> <em> medium </td> </tr> <tr> <t th> favorit ke -2: </th> <td> </td> <td> oranye </td> <td> besar </td> </tr> <tr> <th> favorit ke -3: </t td> pomegraanate </td> <td> sejenis dari hijau-merah </td> <td> bervariasi dari menengah hingga besar </td> </tr> </tbody> </able>

Menggunakan elemen keterangan dapat menentukan judul untuk formulir dan mengaitkannya dengan formulir.

 <ablept> <laption> Hasil Survei Buah 2011 </Caption> <Thead> <tr> </th> <th> nama </t> </th> <th> ukuran </th> </tr> </thead> <tfoot> <ter> <t th> peringkat </t> <th> name </th> <th> warna </t> <t th> ukuran </th> tidak> <ter> <t th> Favorit ke -2: </tm > <td> Semacam warna hijau-merah </td> <td> bervariasi dari sedang hingga besar </td> </tbody> </able>

Suatu bentuk hanya dapat berisi elemen teks, bukan elemen pertama dari formulir, tetapi selalu ditampilkan di atas tabel.

Dalam tabel, karena tabel dibentuk oleh garis, pengoperasian kolom tidak nyaman, seperti gaya definisi kolom formulir. Anda dapat menggunakan elemen colgroup untuk menentukan grup.

 <HTML> <HEAD> <TYED> #colryp1 {latar belakang-color: merah} #colryp2 {latar belakang-color: green; = 1> <colorp id = colorp1 span = 2> </colorp> <colorp id = colorp2> </colorp> <ter> </t> </th> </th> bukan td> <td> CSS pertama saya </td> <td> $ 47 </td> </tr> </able> </body> </html>

Contoh di atas menentukan kelompok dua kolom. Atribut SPAN ColGroup menentukan ekstensi.

 <HTML> <HEAD> <TYED> #colryp1 {latar belakang-color: merah} #col3 {latar belakang-color: green; Border = 1> <colgroup id = colorp1> <col id = col1and2 span = 2/> <col id = color3/> </colorp> <ter> </t> <th> judul </t> <th> harga </th> </tr> <l> <td> 3476896 </td> <td> html pertama saya </td> <td> $ 53 </td> </tr> <td> 2489604 </td> <td> CSS pertama saya </td> <td> $ 47 </td> </able> </body> </html>

Di atas adalah semua isi artikel ini.