Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk merujuk laluan imej tempatan dalam html

Bagaimana untuk merujuk laluan imej tempatan dalam html

DDD
DDDasal
2023-08-22 13:13:467121semak imbas

Cara merujuk laluan imej tempatan dalam HTML: 1. Gunakan laluan relatif Jika imej dan fail HTML berada dalam folder yang sama, anda boleh terus menggunakan nama fail imej sebagai laluan relatif . Anda boleh menggunakan laluan mutlak, tetapi ini biasanya bukan amalan terbaik kerana laluan mutlak boleh menyebabkan masalah dalam persekitaran yang berbeza data boleh terus dibenamkan ke dalam HTML.

Bagaimana untuk merujuk laluan imej tempatan dalam html

Persekitaran pengendalian artikel ini: sistem Windows 10, komputer Dell G3.

Terdapat beberapa cara untuk merujuk laluan imej tempatan dalam HTML, yang akan diperkenalkan secara terperinci di bawah.

Gunakan laluan relatif:

Laluan relatif ialah laluan relatif kepada lokasi fail HTML semasa. Jika gambar dan fail HTML berada dalam folder yang sama, anda boleh terus menggunakan nama fail gambar sebagai laluan relatif. Contohnya, jika fail imej dinamakan "image.jpg", anda boleh menggunakan kod berikut untuk merujuk imej dalam HTML:

<img src="image.jpg" alt="图片">

Jika fail imej terletak dalam folder peringkat atas fail HTML semasa, anda boleh menggunakan ".../" untuk menunjukkan folder peringkat atas. Sebagai contoh, jika fail imej terletak dalam folder "imej" dalam folder peringkat atas, anda boleh menggunakan kod berikut untuk merujuk imej:

<img src="../images/image.jpg" alt="图片">

Begitu juga, jika fail imej terletak dalam folder peringkat bawah daripada fail HTML semasa, anda boleh menggunakan "./" mewakili folder semasa. Contohnya, jika fail imej terletak di bawah folder "imej" folder semasa, anda boleh menggunakan kod berikut untuk merujuk imej:

<img src="./images/image.jpg" alt="图片">

Gunakan laluan mutlak:

Laluan mutlak ialah laluan penuh bermula dari direktori akar. Anda boleh menggunakan laluan mutlak untuk merujuk imej tempatan, tetapi ini biasanya bukan amalan terbaik kerana laluan mutlak boleh menyebabkan masalah dalam persekitaran yang berbeza. Walau bagaimanapun, jika anda benar-benar perlu menggunakan laluan mutlak, anda boleh menggunakan kod berikut untuk merujuk imej:

<img src="/path/to/image.jpg" alt="图片">

di mana "/path/to/" ialah laluan fail imej berbanding dengan direktori akar.

Gunakan pengekodan Base64:

Pengekodan Base64 ialah kaedah menukar imej kepada rentetan teks, yang boleh membenamkan data imej terus ke dalam HTML. Kaedah ini sesuai untuk imej kecil atau apabila anda perlu mengurangkan permintaan HTTP. Anda boleh menggunakan kod berikut untuk menukar imej kepada pengekodan Base64:

<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAAAAAAAD/4QA6RXhpZgAATU0AKgAAAAgABwEAAAQAAABsAAAABAAQAAA
EBAAABAAAAABsAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAB9KADAAQAAAABAAAB9AD/2wBDAAoHBwkHBgoJ

Antaranya, bahagian selepas "data:image/jpeg;base64," ialah pengekodan Base64 bagi imej. Ambil perhatian bahawa kaedah ini akan meningkatkan saiz fail HTML dan boleh menjejaskan kelajuan memuatkan halaman.

Tidak kira kaedah yang anda gunakan, anda perlu memastikan bahawa fail imej wujud dalam laluan yang ditentukan dan laluan itu betul. Di samping itu, adalah disyorkan untuk meletakkan fail imej dalam folder yang sama dengan fail HTML atau dalam folder imej khas untuk pengurusan dan penyelenggaraan yang lebih mudah.

Atas ialah kandungan terperinci Bagaimana untuk merujuk laluan imej tempatan dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn