Cara Membuat Tabel 10 Nama
1. Masukan Kode HTML Berikut ini ke dalam Aplikasi Visual Studio Code, CodeLobster dll
<center><html>
<head>
<title>Pertemuan 2</title>
</head>
<body>
<center><text><b>* MEMBUAT TABEL <br /> SMK NEGERI 4 JAKARTA *</b></text></center>
<table border="3">
<tr>
<td align="center">NO.</td>
<td align="center">NAMA</td>
<td align="center">KELAS</td>
<td align="center">JURUSAN</td>
<td align="center">NO. TELEPON</td>
<td align="center">ALAMAT</td>
</tr>
<tr>
<td align="center">1.</td>
<td align="center">HILMI AMMAR</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">089658975485</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">2.</td>
<td align="center">ALDIAN YOGA PERMANA</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085216869678</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">3.</td>
<td align="center">ZULIAN AMARIE</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085276487687</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">4.</td>
<td align="center">DIKI ARIF PANGESTU</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">083889173981</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">5.</td>
<td align="center">MUHAMMAD NAUFAL ALBIANSYAH</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085218768992</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">6.</td>
<td align="center">ARVA RAIHAN JAVIER</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085218682316</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">7.</td>
<td align="center">MUHAMMAD HAIKAL .R</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">083889691269</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">8.</td>
<td align="center">MUHAMMAD ARIZ .P</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">089721836128</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">9.</td>
<td align="center">SATRIA PANCA</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085321977932</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
<tr>
<td align="center">10.</td>
<td align="center">ALFIAN WAHYU</td>
<td align="center">X</td>
<td align="center">T.K.J</td>
<td align="center">085321936128</td>
<td align="center">JL. TIPAR CAKUNG</td>
</tr>
</table>
</body>
</html></center>
</br>
</br>
<html>
<head>
<title>Pertemuan 2</title>
<link rel="stylesheet" text type="text/css" href="style.css"/>
</head>
<center>
<body>
<table border="2">
<tr>
<td align="center" class="nomor">NO</td>
<td align="center" class="form-nama">NAMA</td>
<td align="center" class="form-nama">KELAS</td>
<td align="center" class="form-nama">JURUSAN</td>
<td align="center" class="form-nama">NO. TELEPON</td>
<td align="center" class="form-nama">ALAMAT</td>
<tr>
<td align="center" class="nomor">1.</td>
<td class="form-username">HILMI AMMAR</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085276487687</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">2.</td>
<td class="form-username">ALDIAN YOGA .P</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085276487687</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">3.</td>
<td class="form-username">ZULIAN AMARIE</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085276487687</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">4.</td>
<td class="form-username">DIKI ARIF . P</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">083889173981</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">5.</td>
<td class="form-username">M. NAUFAL</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085218768992</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">6.</td>
<td class="form-username">ARVA RAIHAN . J</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085218682316</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">7.</td>
<td class="form-username">M. HAIKAL</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">083889691269</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">8.</td>
<td class="form-username">M. ARIZ</td>
<td align="center" class="form-username" class="">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">089721836128</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">9.</td>
<td class="form-username">SATRIA PANCA</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085321977932</td>
<td align="center" class="form-username">-</td>
</tr>
<tr>
<td align="center" class="nomor">10.</td>
<td class="form-username">ALFIAN WAHYU</td>
<td align="center" class="form-username">X/10</td>
<td align="center" class="form-username">TKJ</td>
<td align="center" class="form-username">085321936128</td>
<td align="center" class="form-username">-</td>
</tr>
</table>
</body>
</html></center>
2. Buatlah New File - CSS - Lalu Letakkan File HTML dan CSS dalam satu Folder..nomor{
width: 20px;
height: 50px;
margin-left: 8px;
padding:6px 12px;
font-size:14px;
line-height:1.42857143;
color:#555;
background-color:#fff;
background-image:none;
border:1px solid #ccc;
border-radius:1px;
font-weight: bold;
font-size: 18px;
}
.form-nama{
width: 150px;
height: 35px;
margin-left: 8px;
padding:6px 12px;
font-size:14px;
line-height:1.42857143;
color:#555;
background-color:#fff;
background-image:none;
border:1px solid #ccc;
border-radius:1px;
font-size: 18px;
}
.form-username{
width: 150px;
height: 50px;
margin-left: 8px;
padding:6px 12px;
font-size:14px;
line-height:1.42857143;
color:#555;
background-color:#fff;
background-image:none;
border:1px solid #ccc;
border-radius:1px;
font-weight: bold;
font-size: 18px;
}
.aa{
width: 80%;
height: 50px;
margin-left: 8px;
padding:6px 12px;
font-size:14px;
line-height:1.42857143;
color:#555;
background-color:#fff;
background-image:none;
border:1px solid #ccc;
border-radius:1px;
}
NO. | NAMA | KELAS | JURUSAN | NO. TELEPON | ALAMAT |
1. | HILMI AMMAR | X | T.K.J | 089658975485 | JL. TIPAR CAKUNG |
2. | ALDIAN YOGA PERMANA | X | T.K.J | 085216869678 | JL. TIPAR CAKUNG |
3. | ZULIAN AMARIE | X | T.K.J | 085276487687 | JL. TIPAR CAKUNG |
4. | DIKI ARIF PANGESTU | X | T.K.J | 083889173981 | JL. TIPAR CAKUNG |
5. | MUHAMMAD NAUFAL ALBIANSYAH | X | T.K.J | 085218768992 | JL. TIPAR CAKUNG |
6. | ARVA RAIHAN JAVIER | X | T.K.J | 085218682316 | JL. TIPAR CAKUNG |
7. | MUHAMMAD HAIKAL .R | X | T.K.J | 083889691269 | JL. TIPAR CAKUNG |
8. | MUHAMMAD ARIZ .P | X | T.K.J | 089721836128 | JL. TIPAR CAKUNG |
9. | SATRIA PANCA | X | T.K.J | 085321977932 | JL. TIPAR CAKUNG |
10. | ALFIAN WAHYU | X | T.K.J | 085321936128 | JL. TIPAR CAKUNG |
Membuat Tabel 10 Nama ( + CSS )
NO | NAMA | KELAS | JURUSAN | NO. TELEPON | ALAMAT |
1. | HILMI AMMAR | X/10 | TKJ | 085276487687 | - |
2. | ALDIAN YOGA .P | X/10 | TKJ | 085276487687 | - |
3. | ZULIAN AMARIE | X/10 | TKJ | 085276487687 | - |
4. | DIKI ARIF . P | X/10 | TKJ | 083889173981 | - |
5. | M. NAUFAL | X/10 | TKJ | 085218768992 | - |
6. | ARVA RAIHAN . J | X/10 | TKJ | 085218682316 | - |
7. | M. HAIKAL | X/10 | TKJ | 083889691269 | - |
8. | M. ARIZ | X/10 | TKJ | 089721836128 | - |
9. | SATRIA PANCA | X/10 | TKJ | 085321977932 | - |
10. | ALFIAN WAHYU | X/10 | TKJ | 085321936128 | - |
Tambahkan Komentar
EmoticonEmoticon