-2

Como verán en la siguiente imagen tengo una carpeta de páginas principales introducir la descripción de la imagen aquí

son 18 páginas enlazadas a la pagina home.html introducir la descripción de la imagen aquí

Esa página home tiene enlazada una hoja de estilos y una imagen para el icono de la página introducir la descripción de la imagen aquí

A lo cual si funciona este es el resultado introducir la descripción de la imagen aquí introducir la descripción de la imagen aquí

Cada página es una imagen de vídeo que al hacer clic me lleva a una de las páginas, que estan enlazadas a home, pero el resultado es el siguiente, introducir la descripción de la imagen aquí

Esta página al igual que todas las 18 tiene enlazadas la hoja de estilo y el icono de la imagen introducir la descripción de la imagen aquí

pero como ven en la imagen anterior el problema es que sale simple, como si no tuviera enlazada ninguna hoja de estilo y como si el icono no tuviera extensión mas todas las 18 hojas tinen lo siguiente

<html>
<head>
	<title>enviar mensaje masivo</title>
  

<link rel="shortcut icon" type="image/x-icon" href="imagenes/alex.ico">
<link rel="stylesheet" type="text/css" href="css/estilos.css">
</head>
<body>
	
<header>

¿Sucederá este problema porque yo copié y pegue la información?

2
  • la ubicaciones del icono es correcta así como la de la hoja de estilos y no han cambiado el 16 ene. 2018 a las 17:18
  • Pregunta! Ya que estás programando en Sublime text ¿me lo recomiendas para programar en HTML? Ah respondiendo a tu problema: Intenta usar una ruta relativa (como te lo han dicho anteriores respuestas a la mía). No tengo que especificar porque ya lo hicieron jeje :3
    – Alonso
    el 6 mar. 2018 a las 7:44

3 respuestas 3

1

DOM Acorde al W3C el Modelo de Objetos del Documento es una interfaz de programación de aplicaciones (API) para documentos validos HTML y bien construidos XML. Define la estructura lógica de los documentos y el modo en que se accede y manipula.

El DOM permite un acceso a la estructura de una página HTML mediante el mapeo de los elementos de esta página en un árbol de nodos. Cada elemento se convierte en un nodo y cada porción de texto en un nodo de texto. Para comprender más fácilmente véase el siguiente ejemplo:

<body>
<p>Esto es un párrafo que contiene <a href="#">un enlace</a> en el medio. </p>
<ul>
<li>Primer punto en la lista</li>
<li>Otro punto en la lista</li>
</ul>
</body>

Como puede verse un elemento [a] se encuentra localizado dentro de un elemento [p] del HTML, convirtiéndose en un nodo hijo, o simplemente hijo del nodo [p], de manera similar [p] es el nodo padre. Los dos nodos li son hijos del mismo padre, llamándose nodos hermanos o simplemente hermanos.

Es importante comprender la diferencia entre elementos y nodos de textos. Los elementos comúnmente son asociados a las etiquetas. En HTML todas las etiquetas son elementos, tales como < p>, < img> y < div> por lo que tienen atributos y contienes nodos hijos. Sin embargo, los nodos de textos no poseen atributos e hijos.

Lo que tienes que comprender son las rutas absolutas y relativas. Tu carpeta "Páginas principales" en las cuales pones tus páginas están mas adentro que tu página HOME por ello la ruta desde el <link rel="stylesheet" href="css/estilos.css"> que pusiste busca dentro de la carpeta "Páginas principales" en la cual no hay nada, para eso le pones esto "../" para indicar que debe retroceder al directorio inmediato superior. Espero haberte ayudado.

3
  • y que pasaria si yo pusiera dentro de la ruta paginas principales la hoja de estilos, ya no seria necesario agrega ../ ? el 16 ene. 2018 a las 18:08
  • otra solución esque las paginas estuvieran junto con home? entonces la ruta que estaba poniendo yo sin los puntos es para buscar una carpeta inmediata inferior? el 16 ene. 2018 a las 18:11
  • Esta bien a que hayas puesto las páginas en una carpeta especial, eso les da más orden, no te compliques mucho por la ruta, al fin y al cabo son solo la referencia a la ubicación de tus recursos, eso siempre puede variar. el 16 ene. 2018 a las 19:23
0

Veo que tus paginas "enlazadas" están en la carpeta "Páginas principales", y las sigues buscando así <link rel="stylesheet" href="css/estilos.css"> pero ya que están de esta forma, el buscador no la encuentra, lo que tienes que hacer es buscar tus estilos con ruta relativa ../ así: <link rel="stylesheet" href="../css/estilos.css"> de esta forma si cargará al DOM de la página.

7
  • la carpeta principal de mi proyecto se llama alexandrawp y dentro esta home.html y la carpeta paginas principales y la carpeta css dentro de la cual esta la hoja de estilo y la carpeta imagenes dentro de la cual esta alex.ico. el 16 ene. 2018 a las 17:40
  • ¿Cómo deberia escribir la ruta? el 16 ene. 2018 a las 17:41
  • me explicas mas sobre lo que es dom y su relación con las rutas relativas? y cual es el oponente de rutas relativas?, es decir que tipo de ruta estaba utilizando yo, y porque esta mal? el 16 ene. 2018 a las 17:44
  • Esta bien, pero eso requiere una nueva respuesta el 16 ene. 2018 a las 17:47
  • una nueva respuesta de parte mia o suya? el 16 ene. 2018 a las 17:48
0

No te enredes con las rutas, por el momento ten en cuenta que lo que estas usando son rutas relativas, o sea que a partir del archivo en donde te encuentra, buscas otro archivo que quieras enlazar. Estas escribiendo mal las rutas en tus "18 paginas principales" lo correcto es lo siguiente

<head>
   <title>enviar mensaje masivo</title>
   <link rel="shortcut icon" type="image/x-icon" href="../imagenes/alex.ico">
   <link rel="stylesheet" type="text/css" href="../css/estilos.css">
</head>

Utilizas ".." para regresar un carpeta y "/" para meterte a una carpeta o para tomar un archivo.

te lo pongo simple para que lo comprendas, dices: estoy en el archivo "enviar mensaje masivo.html" estoy dentro de la carpeta "paginas principales", necesito regresar una carpeta atrás pongo "..", meterme a la carpeta "css", pongo "/" y luego necesito el archivo "estilos.css" pongo de nuevo "/". Y asi obtienes la ruta correcta "../css/estilos.css"

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.