Setelah anda mengetahui struktur dari sebuah file HTML dan apa saja yang harus ditulis pertama kali. Selanjutnya saya akan mengajak anda untuk mempelajari cara memuat/menampilkan sebuah gambar dan memahami apa itu atribut HTML. Untuk memuat sebuah gambar pada dokumen HTML, kita akan menggunakan tag <img>. Lalu dimana kita meletakkan gambar tersebut? Di dalam tag <img> kah?
Setiap tag HTML dapat memiliki satu atau lebih atribut, atribut ini berfungsi untuk menyimpan informasi yang berkaitan dengan tag tersebut. Pada tag <img> kita akan menggunakan atribut src untuk menyimpan lokasi gambar :
Selanjutnya untuk memasukkan nilai pada atribut, kita gunakan operator sama dengan (=) diikuti dengan lokasi gambar yang diapit oleh tanda kutip.
Cara menjalakan atribut img dengan langkah-langkah sebagai berikut:
1. Buatlah folder terlebih dahulu nama terserah kalian kemudian buat file baru dengan format HTML dan masukan logo atau gambar yang anda inginkan kedalam 1 folder dan file yang telah dibuat sebelumnya.
2. Setelah itu ketikan kode HTML berikut ini:
3. Kemudian buka browser, anda akan melihat gambar telah termuat pada file HTML anda.
Setiap tag img, selain memiliki atribut src untuk menyimpan lokasi gambar, anda juga harus menyertakan atribut alt yang akan digunakan sebagai teks alternatif ketika gambar tidak berhasil dimuat atau gambar hilang.
Dan atribut lainnya adalah atribut width dan height, yang berfungsi untuk menentukan lebar dan tinggi dari gambar tersebut. Memang hal ini tidak perlu dilakukan karena gambar secara otomatis akan terload dengan ukuran sebenarnya, namun hal ini sangat dianjurkan untuk mempercepat proses pemuatan gambar.
Jika anda menyimpan gambar tersebut pada sebuah folder seperti berikut. Maka yang perlu anda lakukan adalah menambahkan nama folder tersebut diikuti
dengan tanda slash (/) dan nama file gambar yang akan dimuat:
Jika dalam folder tersebut terdapat folder lagi, dan gambar yang ingin anda muat ada di dalamnya maka penulisannya menjadi seperti berikut :
Selain penggunaan lokasi gambar seperti di atas, anda juga bisa menampilkan gambar yang sudah terdapat di internet, penulisan seperti ini disebut dengan hotlinking, misalnya:
Penggunaan hotlinking sangat tidak dianjurkan karena gambar yang dimuat bukanlah milik kita dan tentunya juga akan merugikan si pemilik gambar.
cara menjalankan background dengan cara sebagai berikut:
1. Cara pertama sam a dengan di atas tinggal mengganti kode HTML
2. Ketikan kode seperti dibawah ini:
3. Hasilnya
Sekian penjelasan tentang atribut gambar yang ada di html semoga dapat dipahami dengan mudah jangan lupa kunjungi warokdroid.blogspot.com terus agar tidak ketinggalan ada kurang lebinya saya mohon maaf wassalamualikum wr.wb.
Selanjutnya untuk memasukkan nilai pada atribut, kita gunakan operator sama dengan (=) diikuti dengan lokasi gambar yang diapit oleh tanda kutip.
Cara menjalakan atribut img dengan langkah-langkah sebagai berikut:
1. Buatlah folder terlebih dahulu nama terserah kalian kemudian buat file baru dengan format HTML dan masukan logo atau gambar yang anda inginkan kedalam 1 folder dan file yang telah dibuat sebelumnya.
3. Kemudian buka browser, anda akan melihat gambar telah termuat pada file HTML anda.
Setiap tag img, selain memiliki atribut src untuk menyimpan lokasi gambar, anda juga harus menyertakan atribut alt yang akan digunakan sebagai teks alternatif ketika gambar tidak berhasil dimuat atau gambar hilang.
Dan atribut lainnya adalah atribut width dan height, yang berfungsi untuk menentukan lebar dan tinggi dari gambar tersebut. Memang hal ini tidak perlu dilakukan karena gambar secara otomatis akan terload dengan ukuran sebenarnya, namun hal ini sangat dianjurkan untuk mempercepat proses pemuatan gambar.
Jika anda menyimpan gambar tersebut pada sebuah folder seperti berikut. Maka yang perlu anda lakukan adalah menambahkan nama folder tersebut diikuti
dengan tanda slash (/) dan nama file gambar yang akan dimuat:
Jika dalam folder tersebut terdapat folder lagi, dan gambar yang ingin anda muat ada di dalamnya maka penulisannya menjadi seperti berikut :
Selain penggunaan lokasi gambar seperti di atas, anda juga bisa menampilkan gambar yang sudah terdapat di internet, penulisan seperti ini disebut dengan hotlinking, misalnya:
Penggunaan hotlinking sangat tidak dianjurkan karena gambar yang dimuat bukanlah milik kita dan tentunya juga akan merugikan si pemilik gambar.
cara menjalankan background dengan cara sebagai berikut:
1. Cara pertama sam a dengan di atas tinggal mengganti kode HTML
2. Ketikan kode seperti dibawah ini:
Sekian penjelasan tentang atribut gambar yang ada di html semoga dapat dipahami dengan mudah jangan lupa kunjungi warokdroid.blogspot.com terus agar tidak ketinggalan ada kurang lebinya saya mohon maaf wassalamualikum wr.wb.
sangat membantu kak. makasih ya
ReplyDeleteSama-sama kak, semoga bermanfaat
ReplyDelete