Cara Membuat Border Strip Table pada W3.CSS

Kelemahan manusia adalah sering kali berbuat salah. Dan kelebihan manusia adalah dapat belajar dari kesalahannya. Oke masih tentang table, kali ini saya akan berbagi ilmu kepada kalian tentang Cara Membuat Border Strip Table pada W3.CSS.

Jika sebelumnya saya membahas tentang Cara Membuat Basic Table pada W3.CSS. Oke sesuai judul di atas Cara Membuat Border Strip Table pada W3.CSS. Langsung saja kita praktekkan, berikut caranya:

Seperti biasa, siapkan file index.html nya.

Kemudian, isi di bagian <head> link untuk menghubungkan HTML kita dengan library CSS dari W3.CSS.

<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">

Setelah itu, isi di bagian <body> tag-tag seperti gambar di bawah.

<body class="w3-container">

<h2>Bordered Striped Table</h2>
<p>The w3-bordered class collapses table borders into a single border.</p>

<table class="w3-table w3-striped w3-bordered">
<tr>
  <th>First Name</th>
  <th>Last Name</th>
  <th>Points</th>
</tr>
<tr>
  <td>Jill</td>
  <td>Smith</td>
  <td>50</td>
</tr>
<tr>
  <td>Eve</td>
  <td>Jackson</td>
  <td>94</td>
</tr>
<tr>
  <td>Adam</td>
  <td>Johnson</td>
  <td>67</td>
</tr>
</table>

</body>

Bagaimana teman-teman? Cukup mudah bukan?

Sekian untuk tutorial kali ini tentang Cara Membuat Border Strip Table pada W3.CSS.

Semoga bermanfaat, terima kasih

Cara Membuat Border Strip Table pada W3.CSS

Kategori