Selamat datang di Kelas 6B
Nama Guru : Novarief Saisywa, S.Kom.
Satuan Pendidikan : SD Al-Azhar 2 Bandar Lampung
Mata Pelajaran : Teknologi Informasi dan Komunikasi (TIK)
Kelas / Semester : 6B/1
Hari, Tanggal : kamis, 3 Oktober 2024
Kompetensi Dasar : Mengenal Program HTML untuk Membuat Dokumen Web
Standar Kompetensi : Mendemonstrasikan penggunaan Tag-Tag HTML dalam program HTML
Pembelajaran Ke : 9
Aamiin, Aamiin Ya Rabbal Alamin
1. Alur Tujuan Pembelajaran
- Mengetahui Tag Garis Horizontal pada program HTML
2. Tujuan Pembelajaran
- Peserta didik dapat menyebutkan dan menjelaskan Tag Garis Horizontal pada program HTML
3. Capaian Pembelajaran
- Peserta didik mampu menyebutkan serta menjelaskan Tag Garis Horizontal pada program HTML
4. Kegiatan Awal (Sapaan)
Assalammualaikum anak sholih dan sholihah bagaimana kabarnya hari ini? semoga selalu diberikan kesehatan. Aamiin. Sebelum pelajaran hari ini dimulai mari kita murojaah surat terlebih dahulu ya.
5. Apersepsi
Pada pertemuan sebelumnya kita telah belajar tentang Tag Memformat Teks pada program HTML, ada yang bisa menyebut salah satu Tag Memformat Teks? betul sekali, jadi salah satu tag memformat teks yaitu <strong> berfungsi untuk menebalkan teks. Untuk hari ini kita akan belajar tentang Tag Membuat Garis Horizontal pada program HTML.
6. Materi Pembelajaran
Memformat Halaman Web
- Membuat Garis Horisontal (Horizontal Rules)
Untuk membuat garis horisontal, digunakan tag <hr>. atribut – atribut pada tag <hr> adalah
· Size berfungsi untuk menentukan ketebalan garis, SIZE = Pixels (line height, default 2)
· Width berfungsi untuk menentukan lebar garis, WIDTH = Length (line width, pixel or percentage, default 100%)
· Align berfungsi untuk mengatur peletakan garis pada halaman web, ALIGN =[ left | center | right ] (horizontal alignment, default center)
· Noshade berfungsi untuk mengatur agar garis tidak disertai bayangan
Contoh penggunaan :
Ketiklah HTML yang ada dibawah, menggunakan program Notepad atau Wordpad kemudian disimpan di drive/data (D) pada folder yang telah kalian buat, ganti nama file dengan Latihan2.html!
<html>
<head>
<title>latihan 02</title>
</head>
<body bgcolor=#990066 text=#FFCCFF>
<h1>TOKO BUKU FAJAR AGUNG BANDAR LAMPUNG</h1>
<hr width=50% align=left>
<h2>Toko kami menyediakan</h2>
<h3>Alat Tulis</h3>
<br>pensil<br>ballpoint<br>penggaris<br>dll.
<h3>Buku-Buku Pelajaran</h3>
<br>matematika<br>bahasa lampung<br>bahasa inggris<br>dll.
<h3>Alat Kantor</h3>
<br>meja<br>kursi putar<br>map<br>dll.
</body>
</html>
· Jalankan browser di Internet Explore atau mozilla dan buka file diatas!
maka hasilnya akan seperti gambar dibawah ini:
Tugas Praktek 2
setelah membuat struktur HTML diatas, tambahkanlah struktur HTML menggunakan tag <hr> dan Peletakan teks agar tampilan seperti dibawah ini :
Pekerjaan Rumah
Modul TIK Halaman 11 dan 12 dikerjakan dibuku latihan TIK
LATIHAN SOAL 3.
I. PILIHAN GANDA
1. Apa kepanjangan dari HTML?
a. Hyper Text Mail Language c. Hyper Team Mode Language
b. Hyper Text Markup Language d. Hyper Team Master Language
2. Untuk membangun halaman HTML sederhana dapat menggunakan aplikasi ...
a. Excel c. Notepad
b. Winamp d. Messenger
3. Format penyimpanan atau Ekstensi dari halaman web yaitu...
a. .doc c. .hml
b. .xls d. .html
4. Untuk menjalankan HTML menggunakan aplikasi yang termasuk ke dalam web browser yaitu, kecuali……
a. Internet explorer c. Mozila Firefox
b. Macromedia d. Google Chrome
5. Tag ini ditulis setelah tag HTML. Tag ini berfungsi untuk menuliskan keterangan yang berisi tentang text, gambar atau dokumen web yang akan ditampilkan. Tag ini adalah …
a. Head c. Frame
b. Body d. Title
6. Tag pada html ditulis dengan simbol……
a. “<” dan “)” c. “@” dan”/”
b. “{“dan”}” d. “<” dan “>”
7. Kode HTML yang dituliskan secara tidak langsung menggunakan pemrograman?
a. Macromedia Dreamweaver c. Wordpad
b. Notepad d. Internet Explore
8. Dibawah ini adalah perintah untuk meletakkan teks dikanan dan kiri halaman adalah ….
a. <div align =”center”> c. <div align=”justify”>
b. <div align=”right> d. <div align=”left”>
9. Penulisan tag HTML untuk menebalkan tulisan dibawah ini yang benar adalah ….
a. <streng>ALAZHAR</streng> c.<strong>ALAZHAR<strong>
b. <em>ALAZHAR</em> d.<strong>ALAZHAR</strong>
10. <html>
<head>
<title>latihan 01</title>
</head>
<body>
<h1>TOKO BUKU SERBA MURAH</h1>
<h2>Toko kami menyediakan</h2>
</body>
</html>
Jika tag HTML diatas ditampilkan menggunakan web browser, apa yang akan terjadi pada perubahan huruf pada isi tag <h1> dan <h2>......
a. Huruf pada <h1> lebih kecil dari <h2>
b. Huruf pada <h1> lebih besar dari <h2>
c. Huruf pada <h1> dan <h2> menjadi tebal
d. Huruf pada <h1> dan <h2> menjadi miring
II. ESSAY
1. Apakah yang dimaksud dengan HTML dan HTTP?
2. Sebutkan langkah penyimpanan pada file html!
3. Sebutkan dan jelaskan fungsi dari nilai yang diisikan pada tag yang digunakan untuk mengatur peletakan teks!
4. Bagaimana cara menampilkan program notepad?
5. Buatlah contoh kode html yang apabila dijalankan menggunakan web browser, tulisannya menjadi tebal dan miring!
7. Penutup
Demikian untuk pembalajaran hari ini yang dapat bapak sampaikan, Jangan lupa selalu melaksanakan shalat 5 waktu dan senantiasa selalu murojaah agar hafalan kalian tetap terjaga dan jangan lupa selalu berbuat baik dan selalu tolong menolong dan serta jagalah kesehatan.
REFLEKSI ATAU KESIMPULAN PEMBELAJARAN
Berdasarkan hasil pembelajaran hari ini dapat diketahui bahwa semua peserta didik sudah mampu memahami materi tentang Tag Memformat Garis Horizontal dengan baik
Dokumentasi Pembelajaran
0 Komentar