Setelah menyalin beberapa kode efek khusus grafik dan gambar dari beberapa situs web, masalah seperti gambar tidak ditampilkan selalu muncul. Berikut adalah tutorial terkait yang ditulis khusus untuk para pemula ini! Mengenai penerapan gambar pada halaman web yaitu penerapan tag gambar pada halaman web, izinkan saya merangkumnya untuk Anda!
1) Ikhtisar markup gambar.
Jika halaman web hanya memiliki teks tetapi tidak ada gambar, maka akan kehilangan banyak vitalitas. Gambar adalah aspek yang sangat penting dalam produksi halaman web. HTML Professional menyediakan tag <IMG> untuk menampilkan gambar ke halaman web. Tag ini memiliki atribut SRC, ALT, ALIGN, BORDER, WIDTH dan HEIGHT.
2) Pengenalan atribut.
Atribut SRC. Untuk tag <IMG>, atribut SRC-nya merupakan atribut yang diperlukan, yaitu SRC harus diberi nilai dalam tag <IMG> dan merupakan bagian tak terpisahkan dari tag. Saat ini, IMG sebaiknya ditulis dengan format sebagai berikut:
Berikut penggalan kutipannya:
<IMG SRC="nilai parameter">
Diantaranya, nilai parameternya adalah nama lengkap file dan jalur gambar.
Kita tahu bahwa file gambar umumnya memakan lebih banyak ruang daripada file teks biasa seperti dokumen HTML, dan desain web sering kali memerlukan penambahan banyak gambar untuk meningkatkan daya tarik. Jika file gambar ini ditambahkan ke dokumen HTML, dokumen HTML akan menjadi sangat besar . Besar, transmisi pada jaringan pasti akan sangat lambat.
Tag <IMG> sebenarnya tidak menambahkan gambar ke dokumen HTML, namun memberitahu HTML: File gambar manakah itu? Di mana? Sehingga HTML dapat memanggilnya dari lokasi asli file gambar tersebut. Fungsi atribut SRC adalah untuk menjawab kedua pertanyaan tersebut, sehingga nilai parameter atribut SRC harus memiliki nama file lengkap dari file gambar yaitu nama file dan ekstensinya seperti logo.gif yang menjawab pertanyaan tersebut. pertanyaan tentang file gambar yang mana; Nilai parameter juga harus memiliki jalur ke file gambar sehingga HTML mengetahui di mana menemukan file gambar tersebut. Di antara nilai parameter atribut SRC, cara menulis path file gambar sering menjadi masalah bagi pemula.
Jalur ke file gambar dapat berupa jalur relatif atau URL. Yang disebut jalur relatif mengacu pada jalur yang dibentuk oleh posisi relatif file yang akan ditautkan atau disematkan ke dalam dokumen HTML saat ini dan file HTML saat ini. Jika file HTML dan file gambar (dengan asumsi namanya logo.gif) berada di direktori yang sama, Anda dapat menulis kode sebagai <IMG SRC="logo.gif">; jika file gambar ditempatkan di direktori tempat file HTML saat ini terletak di subdirektori (dengan asumsi subdirektori tersebut bernama gambar), kodenya harus <IMG SRC="images/logo.gif">; jika file gambar ditempatkan di direktori atas dari direktori tempat HTML saat ini file berada (dengan asumsi direktori atas bernama home ), jalur relatif harus berupa URL kuasi, yaitu, gunakan "../" untuk mewakili situs web pengembang, diikuti dengan jalur file gambar di situs web pengembang . Misalnya, dengan asumsi bahwa home adalah direktori di bawah situs web ini, kodenya harus <IMG SRC=”../home/logo.gif”>. Jika home adalah subdirektori di bawah raja direktori di bawah situs web, kodenya seharusnya tertulis adalah <IMG SRC=”../king/home/logo.gif”>.
Atribut lainnya. Atribut ALT, ALIGN, BORDER, WIDTH, dan HEIGHT pada tag <IMG> bersifat opsional. Atribut ALIGN adalah perataan gambar, dan nilai parameternya adalah kiri, tengah, dan kanan; BORDER adalah batas gambar, dan parameternya lebih besar dari atau sama dengan 0, dan satuan defaultnya adalah piksel; Atribut WIDTH dan HEIGHT Ini adalah lebar dan tinggi gambar, dan satuan default parameternya adalah piksel; atribut ALT adalah teks yang ditampilkan saat mouse bergerak di atas gambar atribut saat membuat halaman web. Apa tujuan melakukan ini? Ini dapat menampilkan teks cepat ketika gambar tidak dapat ditampilkan karena alasan tertentu, sehingga meningkatkan keramahan pengguna.