Atribut src HTML <img>

HTML <img> 标籤

Definisi dan penggunaan

Wajib src Atribut menentukan URL gambar.

Ada dua metode untuk src Tentukan URL dalam atribut:

1. URL Absolut - Tautan ke gambar eksternal yang disimpan di situs web lain. Contoh:

src="https://www.codew3c.com/images/img_girl.jpg"

Perhatian:Gambar eksternal mungkin dijamin hak cipta. Jika Anda tidak memperoleh ijin untuk menggunakannya, Anda mungkin melanggar undang-undang hak cipta. Selain itu, Anda tidak dapat mengawasi gambar eksternal; itu mungkin akan diselamatkan atau diubah secara tiba-tiba.

2. URL Relatif - Tautan ke gambar yang disimpan di dalam situs web.

Di sini, URL tidak termasuk domain. Jika URL tidak dimulai dengan garis miring, itu akan berdasarkan halaman saat ini. Contoh:

src="img_girl.jpg".

Jika URL dimulai dengan garis miring, itu akan berdasarkan domain. Contoh:

src="/images/img_girl.jpg".

Peringatan:Mungkin yang terbaik adalah untuk menggunakan URL relatif. Jika Anda merubah domain, maka tautan akan tetap berfungsi.

Perhatian:Jika browser tidak dapat menemukan gambar, maka akan menampilkan ikon tautan rusak dan teks alt.

Peringatan:Untuk mengatur penyimpanan dokumen, penulis biasanya menyimpan berkas gambar di folder yang terpisah, dan biasanya menamai direktori-direktori ini dengan nama seperti "pics" atau "images". Dalam tutorial CodeW3C.com online, para pengembang kami menyimpan sebagian besar gambar yang sering digunakan di folder yang dinamai "i", "i" adalah singkatan untuk "images", hal ini memungkinkan untuk mempermudah pustaka sejauh mungkin.

Contoh

Dalam contoh di bawah, kami memasukkan gambar tulip yang diambil pengembang CodeW3C.com di Porta Bunga Shanghai, yang bernama berkas "eg_tulip.jpg", disimpan di direktori "i" di server. Ini adalah kode sumber:

<img src="/i/eg_tulip.jpg" />

Kesan kod di atas:


Cuba sendiri

Peringatan:Anda boleh cuba di alat ujian online kamiCuba sendiriJika anda mengubah nama fail di contoh ini kepada "eg_chinarose.jpg", anda akan lihat gambar bunga bulan kucing. Seperti ini:

Kod sumber:

<img src="/i/eg_chinarose.jpg" />

Kesan kod di atas:

Syarat

<img src="URL">

Nilai atribut

Nilai Penerangan
URL

Tentukan URL gambar.

Nilai yang mungkin:

  • URL absolut - Menunjuk ke laman lain (contohnya src="http://www.example.com/image.gif")
  • URL relatif - Menunjuk ke fail di dalam laman (contohnya src="image.gif")

Dukungan pereka web

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Dukungan Dukungan Dukungan Dukungan Dukungan

HTML <img> 标籤