QUIZ Pertemuan 4 Ardi Nurdiansyah - SI-XW41/19-19402004

QUIZ Pertemuan 4
Implementasi Tag HTML

Pemrograman WEB I (Web Desain)
 HEADING
1. Bukalah notepad lalu kalian bisa isikan syntax sebagai berikut :
<html>
<head>
<title>Belajar Membuat HTML</title>
</head>
<body>
<h1>Membuat Heading</h1>
<p>Membuat Paragraf</p>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya heading
dan kalian perhatikan save as typenya pastikan kalian memilih yang html setelah itu
kalian bisa klik save.
3. Setelah itu klik dua kali di heading.html yang telah kalian save tadi maka akan terbuka di
browser sebagai berikut :
 Tag Judul
1. Sama seperti diatas kalian buka notepad kalian isikan syntax berikut ini :
<html>
<head>
</head>
<body>
<h1>Ardi Nurdiansyah</h1>
<p>Membuat Paragraf 1.</p>
<hr>
<h2>Kelas : SI-XW41/19</h2>
<hr>
<h2>NPM : 19402004</h2>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya judul dan
kalian perhatikan save as typenya pastikan kalian memilih yang html setelah itu kalian
bisa klik save.
3. Setelah itu klik dua kali di judul.html yang telah kalian save tadi maka akan terbuka di
 Tag Paragraf
<html>
<head>
</head>
<body>
<p>Mari kita belajar membuat html tag paragraf: </p>
<p>
<br>Ini Ibu Budi
<br>Ini Bapa Budi
<br>Ini Bapa Ibu Budi
</p>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya paragraf
3. Setelah itu klik dua kali di paragraf.html yang telah kalian save tadi maka akan terbuka di
 Tag style
<html>
<head>
</head>
<body style="background-color: # 00 FF F F ;">
<h1 style="text-align:center;">Mari kita belajar membuat html tag style: </h1>
<p style="text-align:center;">
<br>Ini Ibu Ujang
<br>Ini Bapa Ujang
<br>Ini Bapa Ibu Ujang
</p>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya style dan
bisa klik save.
3. Setelah itu klik dua kali di style.html yang telah kalian save tadi maka akan terbuka di
 Tag Formating
<html>
<head>
<title>Mari Belajar Membuat HTML</title>
</head>
<body style="background-color: # FF 00 F F ;">
<h1 style="text-align:center;">Mari kita belajar membuat html tag formating: </h1>
<br><b>Ini Ibu Ujang</b>
<br><i>Ini Bapa Ujang</i>
<br>Ini Bapa <sub> Ujang </sub> dan <sup> Ini Ibu Ujang</sup>
</p>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya
formating dan kalian perhatikan save as typenya pastikan kalian memilih yang html
setelah itu kalian bisa klik save.
3. Setelah itu klik dua kali di formating.html yang telah kalian save tadi maka akan terbuka
di browser sebagai berikut :
 Tag Gambar
<html>
<head>
<title>Mari Belajar Membuat HTML</title>
</head>
<body style="background-color: # FF FF 0 0 ;">
<h2 style="text-align:center;">Mari kita belajar membuat html tag Gambar: </h2>
<b>Syntax ini bertujuan untuk menambahkan gambar</b>
</p>
<img style="display: block; margin: 0 auto; text-align: center;
width: 300px; height: 300px;" src="HTML.JPG" />
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya gambar
3. Setelah itu klik dua kali di gambar.html yang telah kalian save tadi maka akan terbuka di
 Tag Form
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya formdan
bisa klik save.
3. Setelah itu klik dua kali di form.html yang telah kalian save tadi maka akan terbuka di
 Tag Tabel
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
padding: 5px;
}
table {
border-spacing: 15px;
}
</style>
</head>
<body style="background-color: #7FFFD4;">
<h2 style="text-align:center;">Mari kita belajar membuat html tag tabel: </h2>
<b>Syntax ini bertujuan untuk membuat tabel</b>
</p>
<table style="width:100%">
<tr>
<th> First Name </th>
<th> Last Name </th>
<th> Age </th>
</tr>
<tr>
<td> Ardi </td>
<td> Nurdiansyah </td>
<td> 25 </td>
</tr>
<tr>
<td> Reza </td>
<td> Subagja </td>
<td> 65 </td>
</tr>
<tr>
<td> Isyana </td>
<td> Saraswati </td>
<td> 27 </td>
</tr>
</table>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya tabel dan
bisa klik save.
3. Setelah itu klik dua kali di tabel.html yang telah kalian save tadi maka akan terbuka di
 Tag Daftar/List
<html>
<head>
</head>
<body style="background-color: #7FFFD4;">
<h2 style="text-align:center;">Mari kita belajar membuat html tag Daftar/List: </h2>
<b>Syntax ini bertujuan untuk membuat Daftar/List</b>
</p>
<ol type="i">
<li>Black Coffee</li>
<li>Lemon Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
2. Lalu kalian masuk ke file setelah itu klik save as . Kalian bisa isikan file namenya Nama
List dan kalian perhatikan save as typenya pastikan kalian memilih yang html setelah itu
3. Setelah itu klik dua kali di tabel.html yang telah kalian save tadi maka akan terbuka di
Nama : Ardi Nurdiansyah

Kelas : SI-XW41/19
NPM : 19402004

QUIZ Pertemuan 4 Ardi Nurdiansyah - SI-XW41/19-19402004

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

QUIZ Pertemuan 4 Ardi Nurdiansyah - SI-XW41/19-19402004

Diunggah oleh

Hak Cipta:

Format Tersedia

QUIZ Pertemuan 4

Implementasi Tag HTML

Nama : Ardi Nurdiansyah

Anda mungkin juga menyukai