Laporan Tentang Pengenalan HTML
Pemograman Web 1
DiSusun Oleh:
Tarsius Aloysius Pedor
H171600528
POLITEKNIK PERTANIAN NEGERI
SAMARINDA
JURUSAN MANAJEMEN PERTANIAN
PROGRAM STUDI TEKNIK REKAYASA
PERANGKAT LUNAK
2018 / 2019
TUGAS 1
- Head
Di dalam bagian ini biasanya dimuat tag <tittle>
yang menampilkan judul dari halaman web.
Code:
<head>
<title>Welcome to
eepis-its</title>
</head>
- Body
Tag
<body> di gunakan untuk menampilkan text, image link dan semua yang akan
di tampilkan pada web page.
Code:
<html>
<head>
<title>Welcome to eepis-its</title>
</head>
<body bgcolor="lavender">
<p>Document HTML yang Pertama</p>
</body>
</html>
- . Elemen dasar – Block level
Block
level element: terdapat 6 tingkatan, yaitu H1 sampai H6.
Code:
<body>
<h1>Heading one</h1>
<h2>Heading two</h2>
<h3>Heading three</h3>
<h4>Heading four</h4>
<h5>Heading five</h5>
<h6>Heading six</h6>
</body>
- . Elemen dasar – Paragraph ( P )
Menampilkan
teks dalam bentuk paragraf.
Code:
<body>
<h3>Salam Kenal</h3>
<p>
Saya dari jurusan telekom PENS ITS.
Siapa ya yang mo kenalan dengan saya.
</p>
<body>
- .
Elemen dasar – list item (li)
Unordered
list <ul>: List item tidak berurutan (bullet).
Code:
<body>
<P>Nama-nama buah</P>
<ul>
<li>Mangga</li>
<li>Duren</li>
<li>Sirsak</li>
</ul>
</body>
- . list item (li) – continued
Ordered
list <ol>: List item berurutan.
Code:
<body>
<P>Daftar Jurusan PENS ITS</P>
<ol start="1" type=“1">
<li>Telkom</li>
<li>IT</li>
<li>Elka</li>
<li>Elektro Industri</li>
</ol>
<body>
- . Pemformatan Page – Cont. 2
Code:
<html>
<head>
<title>Welcome
to eepis-its</title>
</head>
<body>
<B><P
align="center">Lab di Jur. Telkom</P></B>
Jurusan
Telkom mempunyai 7 lab, diantaranya <br>
<font
color="#9966FF" size="3" face="arial">
1. Lab.
Multimedia </font> <br>
2. Lab.
Microwave <br>
3. Lab.
Komunikasi Digital <br>
</body>
</html>
- . Pembuatan Tabel
Untuk
membuat tabel : <tabble>
Cell-nya dengan tag <td>
Code :
<html>
<head>
<title>Using
Table</title>
</head>
<body>
<table
border="1">
<td>cell
1</td>
<td>cell
2</td>
<td>cell
3</td>
<td>cell
4</td>
</table>
</body>
</html>
- . Pembuatan Tabel – Cont. 1
·
Untuk membuat baris cell : <tr>
·
Untuk title tabel : <caption>
Code:
<body>
<table
border="1">
<caption>Creating
Table</caption>
<tr> <td>cell 1a</td>
<td>cell 1b</td>
</tr>
<tr> <td>cell 2a</td>
<td>cell 2b</td>
</tr>
</table>
</body>
- . Pemformatan Tabel – Cont. 1
Code:
<body>
<table
border=1 cellspacing=5 cellpading=10>
<tr
align="left" valign="top">
<td
width="25%" bgcolor=red>cell 1a</td>
<td
width="25%" bgcolor=yellow>cell 1b</td>
</tr>
<tr
align="center" valign="baseline">
<td>cell
2a</td>
<td>cell
2b</td>
</tr>
</table>
</body>
- Head Forms
<html>
<body>
<h2>Form
Data Diri</h2>
<form
action="/action_page.php">
Nama
Depan:<br>
<input
type="text" name="Nama Depan" value=" ">
<br>
Nama Belakang:<br>
<input
type="text" name="Nama Belakang" value=" ">
<br>
</form>
<h2>Jenis
Kelamin</h2>
<form>
<input
type="radio" name="gender" value="Laki - Laki"
checked> Laki - Laki<br>
<input
type="radio" name="gender" value="Perempuan">
Perempuan<br>
<input
type="radio" name="gender" value="Lainya">
Lainya
</form>
<br>
<input
type="submit" value="simpan"
<br><br>
</body>
</html>
- Hasil Quiz HTML
Tidak ada komentar:
Posting Komentar