Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

Rutas

Bien interesante lo de las rutas, tuve que investigar ya que no me estaba funcionando del todo

./nombre-archivo Cuando se hace referencia a un archivo en el mismo directorio ./directorio/nombre-archivo Cuando se hace referencia a un archivo que esta dentro de un directorio, pero este a su vez esta en la misma ruta ../directorio/nombre-archivo Cuando es necesario volver un directorio y posteriormente entrar a otro para hacer referencia a un archivo

Cabe destacar que cuando está en el mismo directorio funciona sin el punto ni la diagonal

¿Es correcta entonces la manera en la que mencioné, o no es necesario colocar el punto y la diagonal siempre?

2 respuestas

Hola Bayron,

Gracias por tu pregunta sobre las rutas en HTML y CSS. Es genial que hayas investigado para resolver tu problema.

En cuanto a tu pregunta, la forma en la que mencionaste las rutas es correcta. Cuando haces referencia a un archivo en el mismo directorio, no es necesario colocar el punto ni la diagonal. Sin embargo, cuando el archivo está en un directorio diferente, necesitas utilizar "./" para indicar que estás haciendo referencia al directorio actual.

Por ejemplo, si tienes un archivo llamado "estilos.css" en el mismo directorio que tu archivo HTML, puedes hacer referencia a él simplemente escribiendo "estilos.css". Pero si el archivo "estilos.css" está en un directorio llamado "css" dentro del directorio actual, entonces debes escribir "./css/estilos.css" para hacer referencia a él.

Si necesitas volver a un directorio anterior y luego entrar a otro directorio para hacer referencia a un archivo, debes utilizar "../" para indicar el directorio anterior. Por ejemplo, si tienes un archivo HTML en el directorio "html" y quieres hacer referencia a un archivo CSS en el directorio "css" que está en el directorio anterior, debes escribir "../css/estilos.css".

¡Saludos!

Si este post te ayudó, por favor marca como solucionado ✓. ¡Continúa con tus estudios!
solución!

¡Buen Día!

Excelente explicacion Bruno de Alura, pero es buena practica acostumbrarse a utilizar el ./ cuando se hace referencia a contenido estático.

Principalmente por que cuando usas "./imagen.jpg" estás especificando una ruta relativa desde la ubicación actual del archivo HTML, CSS o script que contiene la referencia a la imagen o contenido estático, esta notación ayuda a evitar ambigüedades y garantiza que el navegador buscará la imagen desde la ubicación actual en la jerarquía de archivos, Por ejemplo, si tu estructura de archivos es la siguiente:

/proyecto
  /imagenes
    imagen.jpg
  /css
    estilos.css
  index.html

Desde el archivo "estilos.css", si quieres referenciar la imagen, usarías "./imagenes/imagen.jpg".

en cambio, si usas simplemente "imagen.jpg", el navegador asumirá que la imagen está en la misma ubicación que el archivo que contiene la referencia, o buscará desde la raíz del dominio si no encuentra la imagen en la ubicación actual, esto podría causar problemas si, por ejemplo, tienes una estructura de carpetas compleja y el navegador no puede encontrar la imagen donde espera, también podría ser menos robusto si estás trabajando con URLs absolutas en lugar de rutas relativas.

En resumen, usar "./imagen.jpg" es más específico y menos propenso a errores, ya que asegura que la referencia se resuelva desde la ubicación actual del archivo. Es especialmente útil en proyectos más grandes con una estructura de carpetas compleja. Por otro lado, "imagen.jpg" puede funcionar bien en situaciones simples, pero como buena practica es escencial el usar "./".

La explicación de las carpetas superiores con "../" es correcto y bien explicado.