Postingan

Menampilkan postingan dari Oktober, 2023

Pertemuan 24

Gambar
  Belajar Elemen Form Radio Button pada HTML Elemen `<input>` dengan tipe `radio` adalah elemen formulir HTML yang memungkinkan pengguna untuk memilih satu dari beberapa opsi yang saling eksklusif. Radio button digunakan ketika Anda ingin pengguna memilih satu dari beberapa pilihan yang saling terkait. Berikut adalah contoh penggunaan elemen `<input>` dengan tipe `radio`: Penjelasan dari kode di atas: - `<input>`: Ini adalah elemen input yang digunakan untuk memasukkan data.  - `type="radio"`: Ini adalah atribut yang menentukan jenis data yang akan dikumpulkan, yaitu radio button. - `id`, `name`, dan `value`: Ini adalah atribut yang memberikan identifikasi dan nilai untuk elemen radio button. `id` adalah ID unik untuk elemen, `name` adalah nama grup radio button (harus sama untuk radio button yang saling terkait), dan `value` adalah nilai yang akan dikirim ke server jika radio button tersebut dipilih. - `<label>`: Ini adalah elemen label yang digun...

Pertemuan 23

Gambar
  Belajar elemen Form Date pada HTML Elemen `<input>` dengan tipe `date` adalah elemen formulir HTML yang memungkinkan pengguna memilih tanggal melalui antarmuka kalender. Ini memberikan pengalaman pengguna yang lebih mudah dan memastikan bahwa data tanggal yang dimasukkan sesuai dengan format yang diinginkan. Berikut adalah contoh penggunaan elemen `<input>` dengan tipe `date`: Penjelasan dari kode di atas: - `<input>`: Ini adalah elemen input yang digunakan untuk memasukkan data. - `type="date"`: Ini adalah atribut yang menentukan jenis data yang akan dikumpulkan, yaitu tanggal. - `id="tanggal"` dan `name="tanggal"`: Ini adalah atribut yang memberikan identifikasi untuk elemen input. Id digunakan untuk menghubungkan elemen input dengan label yang sesuai, sedangkan name digunakan untuk mengidentifikasi data saat formulir dikirim. Hasil dari kode di atas adalah formulir yang memiliki antarmuka kalender yang memungkinkan pengguna untuk...

Pertemuan 22

Gambar
  Belajar Elemen Form Panduan tag textarea pada HTML Elemen `<textarea>` dalam HTML adalah elemen formulir yang memungkinkan pengguna untuk memasukkan teks dalam bentuk area teks yang lebih besar dibandingkan dengan elemen input biasa. Berikut adalah contoh penggunaan elemen `<textarea>`: Penjelasan dari kode di atas: - `<textarea>`: Ini adalah elemen textarea yang menandai awal dan akhir dari area teks. - `id="komentar"`: Ini adalah atribut id yang memberikan nama unik untuk elemen textarea. Hal ini memungkinkan Anda untuk menghubungkan elemen textarea dengan label yang sesuai menggunakan atribut `for`. - `name="komentar"`: Ini adalah atribut name yang digunakan untuk mengidentifikasi data saat formulir dikirim. - `rows="4"` dan `cols="50"`: Ini adalah atribut yang mengatur jumlah baris dan kolom yang ditampilkan di area teks. Dalam contoh di atas, area teks akan menampilkan 4 baris dan 50 kolom. Elemen textarea tidak memil...

Pertemuan 21

Gambar
  Belajar tentang Elemen form pada HTML Elemen `<form>` dalam HTML digunakan untuk membuat formulir yang memungkinkan pengguna untuk mengirimkan data ke server. Formulir merupakan cara utama untuk mengumpulkan informasi dari pengguna, seperti teks, angka, pilihan, dll. Berikut adalah contoh elemen `<form>`: Penjelasan dari kode di atas: - `<form>`: Ini adalah elemen utama yang menandai awal dan akhir dari formulir. - `action="/proses_data"`: Ini adalah atribut yang menunjukkan ke alamat atau rute di server tempat data formulir akan dikirimkan untuk diproses. - `method="post"`: Ini adalah metode HTTP yang akan digunakan untuk mengirimkan data formulir ke server. Dalam contoh ini, metode "post" digunakan, yang berarti data formulir akan dikirim dalam badan permintaan HTTP. - `<input>`: Ini adalah salah satu dari banyak kontrol formulir yang dapat digunakan. Dalam contoh di atas, kita memiliki elemen input tipe teks dan tombol kiri...

Pertemuan 20

Gambar
  Di pertemuan kali ini kita akan latihan membuat table   Tag `<table>` adalah salah satu elemen HTML yang digunakan untuk membuat dan mengorganisir data dalam bentuk tabel. Tabel terdiri dari baris (`<tr>`) dan kolom (`<th>` untuk sel kepala atau `<td>` untuk sel data), dan setiap sel dapat berisi teks, gambar, atau elemen HTML lainnya.   ### Value (Nilai) dari Tag `<table>`:   Value dari tag `<table>` dalam HTML adalah data yang dimuat di dalam tabel tersebut. Data ini terdiri dari baris dan kolom, di mana setiap sel (baik sel kepala maupun sel data) dapat berisi teks, gambar, atau elemen HTML lainnya. penjelasan:   tribut dari Tag `<table>`: Atribut dari tag `<table>` adalah informasi tambahan yang dapat diberikan untuk mengontrol perilaku atau tampilan tabel. Namun, dalam prakteknya, atribut untuk tag `<table>` jarang digunakan. Sebaliknya, gaya dan penataan tabel lebih sering dikendalikan mengg...

Pertemmuan 19

Gambar
   Belajar Atribut Rowspan dan Colspan pada HTML Atribut `rowspan` dan `colspan` adalah atribut HTML yang digunakan di dalam elemen `<td>` (sel data) atau `<th>` (sel kepala) dalam sebuah tabel. Mereka memungkinkan Anda untuk menggabungkan beberapa sel ke dalam satu sel atau melebarkan satu sel ke sel-sel tetangga. Atribut `rowspan`: Atribut `rowspan` digunakan untuk menggabungkan sel-sel di beberapa baris menjadi satu sel yang lebih besar secara vertikal. Misalnya, jika Anda ingin menggabungkan dua sel dalam satu baris menjadi satu sel besar yang memanjang ke baris berikutnya, Anda dapat menggunakan `rowspan`. Contoh: Atribut `colspan`: Atribut `colspan` digunakan untuk menggabungkan sel-sel di beberapa kolom menjadi satu sel yang lebih besar secara horizontal. Misalnya, jika Anda ingin menggabungkan dua sel dalam satu kolom menjadi satu sel besar yang merentang ke kolom berikutnya, Anda dapat menggunakan `colspan`. Kombinasi dari `rowspan` da...

Pertemuan 18

Gambar
Belajar Atribut dan Rules pada Table HTML Atribut `rules` adalah salah satu dari beberapa atribut yang dapat digunakan dalam elemen `<table>` HTML untuk mengontrol tampilan garis-garis atau batas antar sel dalam tabel. Atribut ini dapat memiliki beberapa nilai yang mengatur cara garis-garis diterapkan dalam tabel. Berikut adalah nilai-nilai yang dapat digunakan untuk atribut `rules`: 1. `all`*: Ini adalah nilai default. Ini berarti semua batas atau garis akan ditampilkan di sekitar sel, baik vertikal maupun horizontal. 2. `none`: Ini menghilangkan semua batas atau garis di sekitar sel, sehingga tabel akan terlihat seperti tidak memiliki batas atau garis. 3. `rows`: Ini berarti hanya garis horizontal yang akan ditampilkan di antara baris. 4. `cols`: Ini berarti hanya garis vertikal yang akan ditampilkan di antara kolom. Contoh penggunaan atribut `rules`: Dalam contoh di atas, atribut `rules` diatur ke nilai `"all"`, yang berarti garis-garis akan ditampilkan d...

Pertemuan 17

Gambar
  Belajar Elemen Table Pada HTML Elemen `<table>` dalam HTML digunakan untuk membuat dan mengatur data dalam bentuk tabel. Tabel terdiri dari baris dan kolom, dan setiap sel di tabel dapat berisi teks, gambar, atau elemen HTML lainnya. Berikut adalah contoh penggunaan elemen `<table>`: Penjelasan dari kode di atas: - `<table>`: Ini adalah elemen utama yang menandai awal dan akhir dari tabel. - `<tr>`: Ini adalah elemen untuk mendefinisikan baris di dalam tabel (table row). Setiap baris dapat memiliki satu atau lebih sel. - `<th>`: Ini adalah elemen untuk mendefinisikan sel kepala (table header) atau kolom di dalam tabel. Biasanya digunakan untuk judul kolom. - `<td>`: Ini adalah elemen untuk mendefinisikan sel data (table data) di dalam tabel. Ini adalah tempat di mana data sebenarnya dimasukkan. Dalam contoh di atas, kita membuat sebuah tabel dengan dua kolom (Nama dan Usia). Baris pertama (`<tr>`) dianggap sebagai baris kepala karena ...

Pertemuan 16

Gambar
   Belajar cara memanggil audio dan vidio pada HTML Elemen `<audio>` dan `<video>` adalah elemen HTML yang digunakan untuk menyematkan dan memutar audio dan video di halaman web.  Elemen `<audio>`: Elemen `<audio>` digunakan untuk menyematkan file audio, seperti lagu atau suara, di halaman web. Berikut adalah contoh penggunaannya: Ini adalah contoh hasilnya: Penjelasan: - `controls`: Ini adalah atribut yang menambahkan kontrol pemutaran (seperti play, pause, volume, dll.) ke pemutar audio. - `<source>`: Ini adalah elemen yang menentukan sumber audio. Dalam contoh di atas, ada dua sumber audio, yaitu "lagu.mp3" dan "lagu.ogg", dengan tipe MIME yang berbeda (MP3 dan Ogg Vorbis). - Teks di dalam tag terakhir ("Browser Anda tidak mendukung elemen audio.") akan ditampilkan jika browser tidak dapat memutar file audio tersebut. Penjelasan: - `controls`: Seperti pada elemen `<audio>`, ini adalah atribut yang mena...

Pertemuan 15

Gambar
 Belajar elemen-elemen pada HTML Elemen HTML adalah bagian-bagian dasar dari struktur sebuah halaman web. Setiap elemen HTML direpresentasikan oleh tag (tanda kurung sudut), yang mendefinisikan fungsi dan tampilan dari elemen tersebut.  Berikut adalah contoh dasar dari sebuah elemen HTML: ```html <tag> Konten </tag> ``` Di sini: - `<tag>`: Ini adalah tanda yang menandai awal dan akhir dari elemen. Contoh tag adalah `<p>` (untuk paragraf), `<h1>` (untuk heading level 1), `<a>` (untuk tautan), dan banyak lagi. - `Konten`: Ini adalah teks atau elemen lain yang terdapat di dalam elemen tersebut. Contohnya bisa berupa teks, gambar, atau elemen HTML lainnya. Dalam contoh di atas, elemen `<p>` (paragraf) mengelilingi teks "Ini adalah sebuah paragraf.". Hal ini akan menghasilkan paragraf teks pada halaman web. Elemen HTML bisa bersarang, artinya elemen satu bisa berada di dalam elemen lainnya. Selain itu, elemen juga bisa memi...

Pertemuan 14

Gambar
   Belajar cara memanggil gambar di HTML Untuk menampilkan gambar di halaman web menggunakan HTML, Anda akan menggunakan elemen `<img>` (singkatan dari "image"). Berikut adalah langkah-langkah dasar untuk memanggil gambar di HTML: 1. Menyimpan Gambar:    Pertama-tama, pastikan Anda memiliki file gambar yang ingin Anda tampilkan. File gambar harus tersedia di direktori proyek Anda. 2. Menggunakan Elemen `<img>`:    Gunakan elemen `<img>` dengan atribut `src` (source) untuk menentukan lokasi file gambar. Contoh: Dan ini adalah hasilnya: - `src`: Ini adalah atribut wajib yang menunjukkan lokasi atau URL dari file gambar. Lokasi bisa berupa alamat web atau path file lokal.    - `alt`: Ini adalah teks alternatif yang akan ditampilkan jika gambar tidak dapat dimuat atau untuk aksesibilitas pengguna yang menggunakan pembaca layar. Pastikan deskripsi ini mendeskripsikan gambar dengan baik. Menyediakan Deskripsi dan Atribu...

Pertemuan 13

Gambar
Belajar link ke halaman yang pada HTML Untuk membuat tautan (link) ke bagian tertentu dalam halaman yang sama dalam HTML, Anda dapat menggunakan anker atau anchor tag (`<a>`) dengan atribut `href` yang menunjuk ke elemen dengan ID yang sesuai.   Berikut adalah langkah-langkah untuk melakukan ini: Di sini, `href="#bagian-tertentu"` menunjukkan bahwa tautan ini akan membawa pengguna ke elemen dengan ID "bagian-tertentu" di halaman yang sama ketika diklik.   Hasil dari kedua langkah di atas adalah bahwa ketika pengguna mengklik tautan "Tautan ke Bagian Tertentu", mereka akan diarahkan ke bagian halaman yang memiliki ID "bagian-tertentu".   Penting untuk diingat bahwa ID harus unik di dalam halaman web. Jadi pastikan Anda tidak menggunakan ID yang sama untuk lebih dari satu elemen di halaman Anda.

Pertemuan 12

Gambar
  Belajara list dan elemen di html Anda dapat menambahkan tautan (link) ke elemen dalam sebuah daftar HTML (seperti `<ul>`, `<ol>`, atau `<li>`) dengan menempatkan elemen `<a>` di dalam elemen daftar atau item daftar. Berikut adalah contoh penggunaannya:   Penjelasan dari contoh di atas: - `<ul>`: Ini adalah elemen untuk membuat daftar tak-terurut (unordered list). - `<li>`: Ini adalah elemen untuk membuat item dalam daftar. - `<a>`: Ini adalah elemen untuk membuat tautan. - `href="URL"`: Seperti yang dijelaskan sebelumnya, ini adalah atribut yang menentukan URL tujuan dari tautan. - `Teks Tautan`: Ini adalah teks yang akan menjadi bagian dari tautan. Pengguna akan mengklik teks ini untuk mengakses tautan. Hasil dari kode di atas akan menjadi daftar dengan tautan seperti berikut: - [Tautan 1](halaman1.html) - [Tautan 2](halaman2.html) - [Tautan 3](halaman3.html) Setiap tautan akan membawa pengguna ke halama...

Pertemuan 11

Gambar
     Belajar HTML hyperlink Hyperlink (sering disingkat sebagai "link") adalah elemen penting dalam HTML yang memungkinkan Anda untuk membuat tautan atau jalan pintas ke halaman web lain, dokumen, gambar, atau berbagai jenis sumber daya lainnya yang dapat diakses melalui internet. Hyperlink dapat terdiri dari teks, gambar, atau bahkan elemen lainnya yang dapat diakses oleh pengguna dengan mengkliknya. Dalam HTML, tautan ditentukan menggunakan elemen `<a>`, yang merupakan singkatan dari "anchor" (kapal). Berikut adalah cara umum untuk membuat hyperlink: - `<a>`: Ini adalah elemen anchor yang menunjukkan awal dari tautan.   - `href="URL"`: Atribut `href` adalah atribut wajib yang menentukan URL (Uniform Resource Locator) atau alamat web tujuan dari tautan. Contohnya, jika Anda ingin menuju ke Google, Anda akan menggunakan `href="https://www.google.com"`.   - `Teks Tautan`: Ini adalah teks yang akan ditampilkan di halaman web sebagai...

Pertemuan 10

Gambar
 Belajar HTML Membuat Nested List dan List Bersarang Nested list dan list bersarang adalah istilah yang sama yang digunakan untuk menggambarkan daftar yang berisi daftar lain. Nested list dapat digunakan untuk menampilkan daftar item yang memiliki sub-item. Untuk membuat nested list, kita dapat menggunakan tag ul atau ol untuk membuat daftar utama, dan kemudian menggunakan tag ul atau ol lagi untuk membuat daftar sub. Nested list dapat digunakan untuk menampilkan daftar item yang kompleks, seperti daftar menu, daftar langkah-langkah, atau daftar daftar item lainnya. Berikut adalah beberapa tips untuk menggunakan nested list: Gunakan tag ul atau ol untuk membuat daftar utama. Gunakan tag ul atau ol lagi untuk membuat daftar sub. Gunakan tag li untuk setiap item dalam daftar. Gunakan atribut value untuk mengatur urutan item dalam daftar terurut.