├── 02 - Instalasi dan Hello world ├── .vscode │ └── settings.json └── index.html ├── 04 - heading dan paragraph ├── .vscode │ └── settings.json └── index.html ├── 05 - underline white space subscript dan superscript ├── .vscode │ └── settings.json └── index.html ├── 06 - line breaks dan horizontal rule ├── .vscode │ └── settings.json └── index.html ├── 07 - strong emphasis dan blockquote ├── .vscode │ └── settings.json └── index.html ├── 08 - Extra Tag ├── .vscode │ └── settings.json └── index.html ├── 09 - Latihan HTML 1 artikel ├── .vscode │ └── settings.json └── index.html ├── 10 - List ├── .vscode │ └── settings.json └── index.html ├── 11 - Link dan multi page ├── .vscode │ └── settings.json ├── index.html └── pages │ ├── cerita.html │ └── resep.html ├── 12 - HTML attribute ├── .vscode │ └── settings.json └── index.html ├── 13 - Tabel ├── .vscode │ └── settings.json └── index.html ├── 14 - Form ├── .vscode │ └── settings.json └── index.html ├── 15 - Latihan HTML 2 ├── .vscode │ └── settings.json ├── buku.html ├── index.html └── kontak.html ├── 16 - Gambar ├── .vscode │ └── settings.json ├── img │ ├── gambar1.png │ ├── gambar2.png │ └── gambar3.png └── index.html ├── 17 - Video ├── .vscode │ └── settings.json ├── img │ ├── cover.png │ ├── gambar1.png │ ├── gambar2.png │ └── gambar3.png └── index.html ├── 18 - Suara atau Musik ├── .vscode │ └── settings.json ├── img │ ├── cover.png │ ├── gambar1.png │ ├── gambar2.png │ └── gambar3.png ├── index.html └── sound │ └── suara.mp3 ├── 19_20 - Latihan HTML 3_4 ├── .vscode │ └── settings.json ├── buku.html ├── img │ ├── Logo.png │ ├── buku-1.jpeg │ ├── buku-2.jpeg │ └── buku-3.jpeg ├── index.html └── kontak.html └── README.md /02 - Instalasi dan Hello world/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | } -------------------------------------------------------------------------------- /02 - Instalasi dan Hello world/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Hello World! 5 | 6 | 7 | Nama saya Faqihza Mukhlish 8 | mantap mantap mantaaaap 9 | 10 | -------------------------------------------------------------------------------- /04 - heading dan paragraph/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /04 - heading dan paragraph/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Hello World! 5 | 6 | 7 | 8 |

Ini adalah heading 1

9 |

Ini adalah heading 2

10 |

Ini adalah heading 3

11 |

Ini adalah heading 4

12 |
Ini adalah heading 5
13 |
Ini adalah heading 6
14 | 15 | 16 | 17 | 18 |

Nama saya adalah ucup surucup teman dari otong surotong. saya sekolah di SMK IT terbaik se-Indonesia. Jangan tanya saya, karena saya terlalu jago.

19 |

Saya adalah otong surotong teman dari ucup surucup. Saya juga jagoan, jadi jangan tanya saya. Tanya saja sama guru anda.

20 | 21 | 22 | -------------------------------------------------------------------------------- /05 - underline white space subscript dan superscript/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /05 - underline white space subscript dan superscript/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Hello World! 5 | 6 | 7 | 8 | 14 | 15 | 16 | 17 | 18 | 19 |

Ucup dan Otong

20 | 21 |

Nama saya adalah ucup surucup teman dari otong surotong. saya sekolah di SMK IT terbaik se-Indonesia. Jangan tanya saya, karena saya terlalu jago.

22 | 23 |

Saya adalah otong surotong teman dari ucup surucup. Saya juga jagoan, jadi jangan tanya saya. Tanya saja sama guru anda.

24 | 25 | 26 |

Menurut Einstein rumus relativitas energi adalah E=MC2. Lalu, carbon dioksida adalah CO2.

27 | 28 | 29 |

Ini adalah artikel menarik.

30 |

Ini adalah artikel menarik.

31 |

Ini adalah 32 | 33 | 34 | artikel menarik.

35 | 36 | -------------------------------------------------------------------------------- /06 - line breaks dan horizontal rule/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /06 - line breaks dan horizontal rule/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Hello World! 5 | 6 | 7 |

Line breaks dan
Horizontal rules

8 | 9 | 10 |

Paragraph
dapat dibuat dengan menggunakan tag p, lalu kita juga dapat membuat superscript dan subscript dengan sup dan sub.

11 |

Ucup dan Otong adalah sahabat sejati sejak SD. Sejak SD, mereka sudah berteman dan tinggal di komplek yang sama. Mereka sendang bermain bola bersama-sama.

12 |

Ucup adalah anak yang cerdas.

13 |
14 |

Otong adalah anak yang periang.

15 | 16 | -------------------------------------------------------------------------------- /07 - strong emphasis dan blockquote/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /07 - strong emphasis dan blockquote/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Strong, Emphasis dan Blockquote 5 | 6 | 7 | 8 | 9 |

10 | Perhatian: Jangan buang sampah sembarangan. 11 |

12 | 13 | 14 |
15 | Mensana incorporesano, Men Ke sana, Women Ke sono. 16 |
17 | 18 | 19 | 20 |

21 | Ini adalah teman nongkrong, bukan tempat untuk berantem. Bosku bilang, Selalu jaga kesehatan. 22 |

23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /08 - Extra Tag/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /08 - Extra Tag/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Tag Extra 5 | 6 | 7 |

Singkatan

8 | 9 |

Ucup sekolah di SD merdeka

10 |

Kemudian ucup bekerja di NASA cabang garut.

11 | 12 |

Citation dan Definisi

13 |

Saya sudah membaca buku Harry Potter - Order of Phoenix

14 |

Garut adalah salah satu kota di jawa barat, berlokasi di selatan.

15 | 16 |

Insert dan delete

17 |

Otong adalah seorang jagoan ksatria web programming.

18 | 19 | -------------------------------------------------------------------------------- /09 - Latihan HTML 1 artikel/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /09 - Latihan HTML 1 artikel/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Latihan Text 5 | 6 | 7 | 8 |

The story of Ucup

9 | 10 |

Chapter - 1

11 |

Ucup sedang menatap menuju jendela di kamarnya, sudah satu jam lamanya. Di atas mejanya, terdapat buku-buku cerita. Buku-buku cerita itu adalah buku-buku fiksi dan kriminal. Salah satu bukunya adalah Lord of The Ring: Twin Tower.

12 | 13 |

Ucup telah melewati harinya selama sepuluh hari di kamarnya. Dia membaca buku itu dengan serius dan dia selalu teringat dengan perkataan Smeagol, My precious!!!.

14 |
15 |

Chapter - 2

16 |

Otong, teman baik ucup, datang ke rumah Ucup untuk mengetahui kabar temannya. Karena Otong selalu berpegang teguh dengan prinsip hidupnya:

17 | 18 |
19 | Sekali teman, tetap teman. 20 |
21 | 22 |

Otong khawatir temannya, Ucup, akan menghirup banyak CO2 dan kekurangan O2.

23 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /10 - List/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /10 - List/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Belajar tentang List 5 | 6 | 7 | 8 |

Ordered List

9 |
    10 | 11 |
  1. Pasta 1 bungkus
    2. 12 |
  2. Daging cincang 1 kg
    3. 13 |
  3. Tomat 0.25 kg
    4. 14 |
  4. Paprika 0.25 kg
    5. 15 |
  5. Bawang merah 2 siung
    6. 16 |
  6. Bawang putih 2 siung
    7. 17 |
  7. Bumbu dapur
    8. 18 | 22 |
23 | 24 | 25 |

Unordered List

26 | 40 | 41 | 42 |

Definiton List

43 |
44 |
Siapkan Pasta
45 |
Rebuslah spaghetti hingga matang lalu angkat dan tiriskan. Sebentar saja.
46 |
Membuat saus spageti
47 |
Panaskan wajan, lalu tumis bawang putih dan merah hingga harum. Tambahkan garam, kaldu ayam dan micin sesuka hati.
48 |
Sajikan
49 |
Campur dengan menggunakan spatula, sendok, garpu. Lalu santap.
50 |
51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /11 - Link dan multi page/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /11 - Link dan multi page/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Links 5 | 6 | 7 | 8 |

Link

9 | 10 |

Link ke halaman website lain

11 | 12 | Google 13 | 14 |

Link ke halaman sendiri

15 | 20 | 21 |

E-mail

22 | e-mail ke ucup 23 | 24 | -------------------------------------------------------------------------------- /11 - Link dan multi page/pages/cerita.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Latihan Text 5 | 6 | 7 | 8 |

Link ke halaman sendiri

9 | 14 | 15 |

link ke chapter-4

16 | chapter-4 17 |

The story of Ucup

18 | 19 |

Chapter - 1

20 |

Ucup sedang menatap menuju jendela di kamarnya, sudah satu jam lamanya. Di atas mejanya, terdapat buku-buku cerita. Buku-buku cerita itu adalah buku-buku fiksi dan kriminal. Salah satu bukunya adalah Lord of The Ring: Twin Tower.

21 | 22 |

Ucup telah melewati harinya selama sepuluh hari di kamarnya. Dia membaca buku itu dengan serius dan dia selalu teringat dengan perkataan Smeagol, My precious!!!.

23 |
24 |

Chapter - 2

25 |

Otong, teman baik ucup, datang ke rumah Ucup untuk mengetahui kabar temannya. Karena Otong selalu berpegang teguh dengan prinsip hidupnya:

26 | 27 |
28 | Sekali teman, tetap teman. 29 |
30 | 31 |

Otong khawatir temannya, Ucup, akan menghirup banyak CO2 dan kekurangan O2.

32 |
33 |

Chapter - 3

34 |

Ucup sedang menatap menuju jendela di kamarnya, sudah satu jam lamanya. Di atas mejanya, terdapat buku-buku cerita. Buku-buku cerita itu adalah buku-buku fiksi dan kriminal. Salah satu bukunya adalah Lord of The Ring: Twin Tower.

35 | 36 |

Ucup telah melewati harinya selama sepuluh hari di kamarnya. Dia membaca buku itu dengan serius dan dia selalu teringat dengan perkataan Smeagol, My precious!!!.

37 |
38 |

Chapter - 4

39 |

Otong, teman baik ucup, datang ke rumah Ucup untuk mengetahui kabar temannya. Karena Otong selalu berpegang teguh dengan prinsip hidupnya:

40 | 41 |
42 | Sekali teman, tetap teman. 43 |
44 | 45 |

Otong khawatir temannya, Ucup, akan menghirup banyak CO2 dan kekurangan O2.

46 | 47 | 48 | -------------------------------------------------------------------------------- /11 - Link dan multi page/pages/resep.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Belajar tentang List 5 | 6 | 7 |

Link ke halaman sendiri

8 | 13 | 14 |

Ordered List

15 |
    16 | 17 |
  1. Pasta 1 bungkus
    2. 18 |
  2. Daging cincang 1 kg
    3. 19 |
  3. Tomat 0.25 kg
    4. 20 |
  4. Paprika 0.25 kg
    5. 21 |
  5. Bawang merah 2 siung
    6. 22 |
  6. Bawang putih 2 siung
    7. 23 |
  7. Bumbu dapur
    8. 24 | 28 |
29 | 30 | 31 |

Unordered List

32 | 46 | 47 | 48 |

Definiton List

49 |
50 |
Siapkan Pasta
51 |
Rebuslah spaghetti hingga matang lalu angkat dan tiriskan. Sebentar saja.
52 |
Membuat saus spageti
53 |
Panaskan wajan, lalu tumis bawang putih dan merah hingga harum. Tambahkan garam, kaldu ayam dan micin sesuka hati.
54 |
Sajikan
55 |
Campur dengan menggunakan spatula, sendok, garpu. Lalu santap.
56 |
57 | 58 | 59 | 60 | -------------------------------------------------------------------------------- /12 - HTML attribute/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /12 - HTML attribute/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | HTML attribute 5 | 6 | 7 | google 8 |

SD

9 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula, felis at condimentum dapibus, purus tellus tempus nibh, eu tempus ligula magna ut quam. Sed finibus tellus in urna convallis, ac facilisis magna fringilla. Etiam accumsan hendrerit elementum. Nulla facilisi. Curabitur laoreet luctus dolor sit amet sollicitudin. Donec aliquet purus non ligula mollis aliquet. Etiam pharetra velit vel imperdiet semper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Morbi ac velit et massa fermentum semper.

10 | 11 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula, felis at condimentum dapibus, purus tellus tempus nibh, eu tempus ligula magna ut quam. Sed finibus tellus in urna convallis, ac facilisis magna fringilla. Etiam accumsan hendrerit elementum. Nulla facilisi. Curabitur laoreet luctus dolor sit amet sollicitudin. Donec aliquet purus non ligula mollis aliquet. Etiam pharetra velit vel imperdiet semper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Morbi ac velit et massa fermentum semper.

12 | 13 | -------------------------------------------------------------------------------- /13 - Tabel/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /13 - Tabel/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Tabel 5 | 6 | 7 |

Membuat tabel

8 |

Tabel standard

9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 |
123
456
24 | 25 |

Dengan header

26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 |
Senin10:0012:0014:00
Selasa10:0012:0014:00
40 |
41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 |
SeninSelasa
10:0010:00
11:0011:00
53 |
54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 |
Senin
10:00Berangkat Sekolah
12:00Makan Siang
66 |

alokasi kolom

67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 |
SeninSelasa
10:00Berangkat SekolahBerangkat Olahraga
12:00Makan Siang
Shalat Dzuhur
85 | 86 | 87 | -------------------------------------------------------------------------------- /14 - Form/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /14 - Form/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Form 5 | 6 | 7 | 8 |
9 | Nama depan :
10 | Nama belakang :
11 | Password :
12 | 13 |

WNI:Radio button

14 |
15 |
16 | 17 |

Musik favorit: (Checkbox)

18 |
19 |
20 | 21 |

Dropdown List

22 | 26 | 27 |

upload file

28 | 29 |
30 | 31 |
32 | 33 | -------------------------------------------------------------------------------- /15 - Latihan HTML 2/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.fontSize": 18, 3 | "window.zoomLevel": 2.5, 4 | "workbench.iconTheme": "vscode-icons", 5 | "editor.tabSize": 4 6 | } -------------------------------------------------------------------------------- /15 - Latihan HTML 2/buku.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan - MultiPage 6 | 7 | 8 | 9 |

Perpustakaan Kabupaten Bandung

10 |
11 |

Halaman Web:

12 | 17 |
18 |

Daftar Buku

19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 |
NoJudulPenulisStatus
1Bumi ManusiaPramoedya Ananta ToerTersedia
2RectoversoDee LestariDipinjam
3Metode At-Taisir, hafal Qur'an dalam 30 hariAdi HidayatTersedia
49 | 50 | -------------------------------------------------------------------------------- /15 - Latihan HTML 2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan - MultiPage 6 | 7 | 8 | 9 |

Perpustakaan Kabupaten Bandung

10 |
11 |

Halaman Web:

12 | 17 |
18 |

Beranda

19 |

Selamat datang di Perpustakaan Daerah Kabupaten Bandung

20 | 21 |

Perpustakaan ini diperuntukan untuk siapa saja yang ingin membaca buku-buku populer seputar sains, fiksi dan ilmu sosial.

22 | 23 | -------------------------------------------------------------------------------- /15 - Latihan HTML 2/kontak.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan - MultiPage 6 | 7 | 8 | 9 |

Perpustakaan Kabupaten Bandung

10 |
11 |

Halaman Web:

12 | 17 |
18 |

Kontak

19 | 20 |
21 | 22 |
23 |
24 |
25 | 26 |
27 | 28 | -------------------------------------------------------------------------------- /16 - Gambar/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /16 - Gambar/img/gambar1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/16 - Gambar/img/gambar1.png -------------------------------------------------------------------------------- /16 - Gambar/img/gambar2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/16 - Gambar/img/gambar2.png -------------------------------------------------------------------------------- /16 - Gambar/img/gambar3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/16 - Gambar/img/gambar3.png -------------------------------------------------------------------------------- /16 - Gambar/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Gambar 6 | 7 | 8 | 9 |

Menampilkan gambar

10 | 11 | logo 12 | 13 |

di dalam text

14 |

tidak ada alignment

15 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis.

16 | 17 |

alignment di kiri

18 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et iusto praesentium, atque ullam deleniti veniam. Ipsa ipsum dolorem illum in ipsam inventore harum minima saepe odit ullam. Sit, soluta consectetur! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum reiciendis vitae nostrum ea corporis, rerum, natus dolorum provident nulla similique facere ipsam quaerat accusamus dolor quisquam aliquam? Exercitationem, deleniti sapiente.

19 | 20 |

alignment di kanan

21 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et iusto praesentium, atque ullam deleniti veniam. Ipsa ipsum dolorem illum in ipsam inventore harum minima saepe odit ullam. Sit, soluta consectetur! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum reiciendis vitae nostrum ea corporis, rerum, natus dolorum provident nulla similique facere ipsam quaerat accusamus dolor quisquam aliquam? Exercitationem, deleniti sapiente.

22 | 23 |

alignment di atas

24 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et iusto praesentium, atque ullam deleniti veniam. Ipsa ipsum dolorem illum in ipsam inventore harum minima saepe odit ullam. Sit, soluta consectetur! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum reiciendis vitae nostrum ea corporis, rerum, natus dolorum provident nulla similique facere ipsam quaerat accusamus dolor quisquam aliquam? Exercitationem, deleniti sapiente.

25 | 26 |

alignment di bawah

27 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et iusto praesentium, atque ullam deleniti veniam. Ipsa ipsum dolorem illum in ipsam inventore harum minima saepe odit ullam. Sit, soluta consectetur! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum reiciendis vitae nostrum ea corporis, rerum, natus dolorum provident nulla similique facere ipsam quaerat accusamus dolor quisquam aliquam? Exercitationem, deleniti sapiente.

28 | 29 |

alignment di tengah

30 |

logoLorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo, quos eos, culpa consectetur assumenda ad ipsa nisi ut dolore soluta earum? Magni blanditiis enim, nulla dolorem officiis repellendus voluptatem? Reiciendis. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Et iusto praesentium, atque ullam deleniti veniam. Ipsa ipsum dolorem illum in ipsam inventore harum minima saepe odit ullam. Sit, soluta consectetur! Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illum reiciendis vitae nostrum ea corporis, rerum, natus dolorum provident nulla similique facere ipsam quaerat accusamus dolor quisquam aliquam? Exercitationem, deleniti sapiente.

31 | 32 |

width auto, lebar otomatis

33 | gambar 2 34 | gambar 3 35 | 36 | -------------------------------------------------------------------------------- /17 - Video/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /17 - Video/img/cover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/17 - Video/img/cover.png -------------------------------------------------------------------------------- /17 - Video/img/gambar1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/17 - Video/img/gambar1.png -------------------------------------------------------------------------------- /17 - Video/img/gambar2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/17 - Video/img/gambar2.png -------------------------------------------------------------------------------- /17 - Video/img/gambar3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/17 - Video/img/gambar3.png -------------------------------------------------------------------------------- /17 - Video/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Video 5 | 6 | 7 | 8 |

Menampilkan Video

9 | 10 | 18 | 19 | -------------------------------------------------------------------------------- /18 - Suara atau Musik/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "window.zoomLevel": 1, 3 | "editor.fontSize": 18, 4 | "editor.wordWrap": "on" 5 | } -------------------------------------------------------------------------------- /18 - Suara atau Musik/img/cover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/18 - Suara atau Musik/img/cover.png -------------------------------------------------------------------------------- /18 - Suara atau Musik/img/gambar1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/18 - Suara atau Musik/img/gambar1.png -------------------------------------------------------------------------------- /18 - Suara atau Musik/img/gambar2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/18 - Suara atau Musik/img/gambar2.png -------------------------------------------------------------------------------- /18 - Suara atau Musik/img/gambar3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/18 - Suara atau Musik/img/gambar3.png -------------------------------------------------------------------------------- /18 - Suara atau Musik/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Suara 5 | 6 | 7 | 8 |

Menampilkan Suara file mp3

9 | 17 | 18 | -------------------------------------------------------------------------------- /18 - Suara atau Musik/sound/suara.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/18 - Suara atau Musik/sound/suara.mp3 -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.fontSize": 18, 3 | "window.zoomLevel": 3, 4 | "workbench.iconTheme": "vscode-icons", 5 | "editor.tabSize": 4 6 | } -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/buku.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan Multimedia 6 | 7 | 8 | 9 |

logo kabupaten bandung Perpustakaan Daerah 10 | Kabupaten Bandung

11 | 12 |
13 | 14 |

Halaman web:

15 |
  • Beranda
    • 16 |
  • Daftar Buku
    • 17 |
  • Kontak
    • 18 | 19 |
    20 | 21 |

    Daftar Buku

    22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 |
    NoCoverJudulPenulisStatus
    1buku 1Bumi ManusiaPramoedya Ananta ToerDipinjam
    2buku 2RectoversoDee LestariDipinjam
    3buku 3At-TaisirAdi HidayatDipinjam
    57 | 58 | -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/img/Logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/19_20 - Latihan HTML 3_4/img/Logo.png -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/img/buku-1.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/19_20 - Latihan HTML 3_4/img/buku-1.jpeg -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/img/buku-2.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/19_20 - Latihan HTML 3_4/img/buku-2.jpeg -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/img/buku-3.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kelasterbuka/Basic_web_dev_Ch_1_HTML/6db3c5431a13b2a88ac9a28ee0762ce54d49f31c/19_20 - Latihan HTML 3_4/img/buku-3.jpeg -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan Multimedia 6 | 7 | 8 | 9 |

    logo kabupaten bandung Perpustakaan Daerah 10 | Kabupaten Bandung

    11 | 12 |
    13 | 14 |

    Halaman web:

    15 |
  • Beranda
    • 16 |
  • Daftar Buku
    • 17 |
  • Kontak
    • 18 | 19 |
    20 | 21 |

    Beranda

    22 | 23 |

    Selamat Datang di Perpustakaan Daerah Kabupaten Bandung

    24 | 25 |

    Perpustakaan ini diperuntukkan untuk siapa saja yang ingin membaca buku sains, fiksi atau ilmu sosial.

    26 | 27 | -------------------------------------------------------------------------------- /19_20 - Latihan HTML 3_4/kontak.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Latihan Multimedia 6 | 7 | 8 | 9 |

    logo kabupaten bandung Perpustakaan Daerah 10 | Kabupaten Bandung

    11 | 12 |
    13 | 14 |

    Halaman web:

    15 |
  • Beranda
    • 16 |
  • Daftar Buku
    • 17 |
  • Kontak
    • 18 | 19 |
    20 | 21 |

    Kontak

    22 | 23 |
    24 |
    25 |
    26 |
    27 |
    28 | 29 |
    30 | 31 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Basic_web_dev_Ch_1_HTML --------------------------------------------------------------------------------