El proyecto en mi computadora (página web hecha con Html/CSS/Bootstrap y usé Visual Studio Code) no coincide con los archivos que subí y se muestra en Github o Netlify. Es decir, el sitio web no tomó lo que se hizo con Bootstrap (carrusel, pie de página y forma), por lo que al abrir el enlace web en Github y Netlify me muestra un sitio web deformado. Lo intenté todo y no sé qué pasa! ¿Será un problema de la ubicación de carpetas de Bootstrap?... ¿Cuál será el problema?
-
1Intenta ver el inspector dando click derecho opciones de desarrollador->consola a ver que no carga, o abriendo tu web local desde modo incognito dado que chrome guarda los css en cache si sigue igual as lo mismo en la version online– BryroCommented el 5 oct. 2022 a las 2:21
-
Gracias Bryro por tu respuesta, ya solucioné el problema. Me sirvió tu recomendación, efectivamente a través de la consola en el navegador web pude ver los errores del sitio web y el problema era con los 3 archivos de Bootstrap que estaban guardados en carpetas erróneas, además "bootstrap.bundle.min.js" en el <script> ubicado antes de cerrar el </body> lo cambié de ubicación y lo agregué antes de cerrar el </head> y todo funcionó, ahora la web muestra los archivos como corresponde sin deformarse lo realizado con Bootstrap (navbar, carrousel, formulario y footer). Saludos!– LorenzaSFCommented el 7 oct. 2022 a las 1:47
Añade un comentario
|
2 respuestas
En la consola del navegador pone: Ha fallado la carga del con origen "https://lorenzasf.github.io/js/bootstrap.bundle.min.js".
es decir, no es capaz de encontrar este archivo, mira a ver como está la ruta.....
-
Tu respuesta podría mejorarse con información de apoyo adicional. Por favor, pulsa en editar para añadir más detalles, como citas o documentación, para que otros puedan confirmar que tu respuesta es correcta. Puedes encontrar más información sobre cómo escribir buenas respuestas en el centro de ayuda.– Comunidad BotCommented el 5 oct. 2022 a las 17:28
-
Gracias Willian por tu respuesta, ya solucioné el problema. Me sirvió tu recomendación, efectivamente a través de la consola en el navegador web pude ver los errores del sitio web y el problema era con los 3 archivos de Bootstrap que estaban guardados en carpetas erróneas, además "bootstrap.bundle.min.js" en el <script> ubicado antes de cerrar el </body> lo cambié de ubicación y lo agregué antes de cerrar el </head> y todo funcionó, ahora la web muestra los archivos como corresponde sin deformarse lo realizado con Bootstrap (navbar, carrousel, formulario y footer). Saludos! Commented el 7 oct. 2022 a las 1:50
Si lo subiste a github mediante comandos git ( git push )
-mira bien que en el .gitignore no le estes prohibiendo leer los archivos de bootstrap o node depende como lo pusieras.
-Si lo subiste desde la pagina web github mejor intenta hacerlo por comandos, github lo tiene bien explicado ( git init, git add, git commit, git push) te dejo link para tutorial rapido aqui
-Si quieres confirmar que esta bien tu codigo, usa la libreria de bootstrap de forma remota puedes verlas aqui
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Hola HTML</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.2/css/bootstrap-grid.min.css" integrity="sha512-a+PObWRxNVh4HZR9wijCGj84JgJ/QhZ8dET09REfYz2clUBjKYhGbOmdy9KEHilYKgbMSIHNQEsonv/r75mHXw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<p>Hola Mundo!</p>
<div class='row'>
<div class='col-6'>
left
</div>
<div class='col-6'>
right
</div>
</div>
<!--puedes colocarla abajo del body para que carge despues de leer el html o en el head pero poniendo defer al final-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.2/js/bootstrap.min.js" integrity="sha512-5BqtYqlWfJemW5+v+TZUs22uigI8tXeVah5S/1Z6qBLVO7gakAOtkOzUtgq6dsIo5c0NJdmGPs0H9I+2OHUHVQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</body>
</html>
-Prueba usando otros navegadores y que no tenga blockers