todas - HTML: selecciona imágenes de la carpeta raíz de la subcarpeta

insercion de imagenes en html

Question

digamos que lo siguiente es la estructura DIR de mi sitio web

Ahora en index.html puedo simplemente referirme a imágenes como

<img src="./images/logo.png">

pero ¿y si quiero referirme a la misma imagen desde el sub.html cuál será el src?

Answer 1

Cuando cargue sus archivos en el servidor, tenga cuidado, algunos tomos de imágenes no aparecerán en la página web y aparecerá un icono bloqueado que significa que su ruta de archivo no está correctamente organizada o codificada cuando tenga la siguiente estructura de archivos. ser como esta Estructura del archivo: -> web (carpeta principal) -> imágenes (subcarpeta) -> logo.png (imagen en la subcarpeta) el código de arriba está debajo de este estándar

< img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

si cargó sus archivos en el servidor web descuidando la estructura del archivo sin crear la carpeta web, si carga directamente los archivos, las imágenes se romperán y no podrá ver las imágenes, luego cambie el código de la siguiente manera

<img src="images/logo.jpg" alt="image1" width="50px" height="50px">

gracias-> vamshi krishnan

Answer 2

Cuando cargue sus archivos en el servidor, tenga cuidado, algunos tomos de imágenes no aparecerán en la página web y aparecerá un icono bloqueado que significa que su ruta de archivo no está correctamente organizada o codificada cuando tenga la siguiente estructura de archivos. ser como esta Estructura del archivo: -> web (carpeta principal) -> imágenes (subcarpeta) -> logo.png (imagen en la subcarpeta) el código de arriba está debajo de este estándar

 <img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

si cargó sus archivos en el servidor web descuidando la estructura del archivo sin crear la carpeta web, si carga directamente los archivos, las imágenes se romperán y no podrá ver las imágenes, luego cambie el código de la siguiente manera

 <img src="images/logo.jpg" alt="image1" width="50px" height="50px">

gracias-> vamshi krishnan

Answer 3

La referencia relativa sería

<img src="../images/logo.png">

Si conoce la ubicación relativa a la raíz del servidor, ese puede ser el enfoque más simple para una aplicación con una jerarquía compleja de directorios anidados: sería lo mismo en todas las carpetas.

Por ejemplo, si su árbol de directorios representado en su pregunta es relativo a la raíz del servidor, entonces index.html y sub_folder / sub.html usarían:

<img src="/images/logo.png">

Si la carpeta de imágenes está en su lugar en la raíz de una aplicación como foo debajo de la raíz del servidor (ej. http://www.example.com/foo ), entonces index.html ( http://www.example.com/foo/index.html ) eg y sub_folder / sub.html ( http://www.example.com/foo/sub_folder/sub.html ) ambos usan:

<img src="/foo/images/logo.png">

Answer 4

Su index.html solo puede hacer src="images/logo.png" y desde sub.html lo haría src="../images/logo.png"

Answer 5

../ te lleva una carpeta al árbol de directorios. Luego, selecciona la carpeta apropiada y su contenido.

../images/logo.png

Answer 6

../images/logo.png te devolverá una carpeta.

../../images/logo.png te devolverá dos carpetas.

/images/logo.png lo llevará de vuelta a la carpeta raíz, sin importar dónde se encuentre /.

Answer 7

<img src="../images/logo.png">
          __ ______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go one level up