Pemrograman Web 3.2
FORMAT TEKS HALAMAN WEB
PEMBUATAN LIST
HTML
adalah singkatan dari Hypertext
Markup Language.
Struktur file HTML diawali dengan sebuah tag <html> dan ditutup dengan tag </html>.
a. Struktur dasar HTML :
<html>
<head>
<title> ........ </title>
</head>
</head>
<body> .......................
</body>
</html>
- Bagian yang diapit oleh tag <HEAD> merupakan header dari halaman HTML dan tidak ditampilkan pada browser. Bagian ini berisi tag-tag header seperti : <tittle>… </tittle> yang berpungsi untuk mengeluarkan judul pada tittle bar window web browser.
- Sedangkan bagian yang diapit ole tag <BODY> merupakan bagian yang akan ditampilkan pada halaman web browser nantinya. Pada bagian ini anada akan menuliskan semua jenis informasi berupa teks dengan bermacam format maupun gambar yang ingin sampaikan.
b. Atribut Elemen <body>
- BACKGROUND = Lokasi dan nama file (latar belakng dokumen image dokumrn)
- BGCOLOR = Warna (warna latar belakng dokumen, default putih)
c. Elemen Heading <h1>… <h6>
Tag heading berfungsi untuk memformat heading (judul dan subjudul) dari suatu halam web. Heading ini akan memperbesar ukuran huruf unruk setiap jenis heading.
d. Tag HTML Pemformatan Teks
Tag Deskripsi
<b> Mendefinisikan teks tebal
<em> Mendefinisikan teks menekankan
<i> Mendefinisikan teks miring
<small> Mendefinisikan teks kecil
<strong> Mendefinisikan teks penting
<sub> Mendefinisikan teks di bawah garis
<sup> Mendefinisikan teks di atas garis
<ins> Mendefinisikan teks sisipan
<del> Mendefinisikan teks dicoret
<mark> Mendefinisikan teks ditandai
PEMBUATAN LIST
List adalah bagian teks di dalam dokumen yang berisi daftar item dari suatu kelompok atau grup tertentu.
1. LIST BERURUTAN (ORDERED LIST)
Pada list ini tag yang kita gunakan dalam html adalah tag <ol> untuk memanggil fungsi list dan tag <li> (list item) untuk memanggil daftar item.
Tipe :
Contoh :
1.
<body>
<ol type="A">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ol>
</body>
Hasilnya :
a. Teknik Pemesinan
b. Teknik Otomotif
c. Teknik Tekstil
d. Teknik Rekayasa Perangkat Lunak
2. Agar dimulai dari huruf "e"
<body>
<ol type="A" start="5">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ol>
</body>
Hasilnya :
e. Teknik Pemesinan
f. Teknik Otomotif
g. Teknik Tekstil
h. Teknik Rekayasa Perangkat Lunak
2. LIST TIDAK BERURUTAN (UNORDERED LIST)
Pada list ini tag yang kita gunakan dalam html adalah tag <ul> untuk memanggil fungsi list dan tag <li> untuk memanggil daftar item.
Tipe :
Contoh :
<body>
<ul type="disk">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ul>
</body>
Hasilnya :
Tipe :
- A : Membuat list dengan penomoran berupa karakter A, B, C, dst
- a : Membuat list dengan penomoran berupa karakter a, b, c, dst
- I : Membuat list dengan penomoran berupa karakter I, II, III, dst
- i : Membuat list dengan penomoran berupa karakter i, ii, iii, dst
Contoh :
1.
<body>
<ol type="A">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ol>
</body>
Hasilnya :
a. Teknik Pemesinan
b. Teknik Otomotif
c. Teknik Tekstil
d. Teknik Rekayasa Perangkat Lunak
2. Agar dimulai dari huruf "e"
<body>
<ol type="A" start="5">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ol>
</body>
Hasilnya :
e. Teknik Pemesinan
f. Teknik Otomotif
g. Teknik Tekstil
h. Teknik Rekayasa Perangkat Lunak
2. LIST TIDAK BERURUTAN (UNORDERED LIST)
Pada list ini tag yang kita gunakan dalam html adalah tag <ul> untuk memanggil fungsi list dan tag <li> untuk memanggil daftar item.
Tipe :
- Disk : Tanda bulatan hitam. Contoh : <ul type=”disk”>
- Circle : Tanda bulatan putih. Contoh : <ul type=”circle”>
- Square : Tanda kotak. Contoh : <ul type=”square”>
Contoh :
<body>
<ul type="disk">
<li> Teknik Pemesinan
<li> Teknik Otomotif
<li> Teknik Tekstil
<li> Teknik Rekayasa Perangkat Lunak </ul>
</body>
Hasilnya :
- Teknik Pemesinan
- Teknik Otomotif
- Teknik Tekstil
- Teknik Rekayasa Perangkat Lunak
Komentar
Posting Komentar