Q&A
前提・実現したいこと
Git hubでポートフォリオのホームページを公開したい。
発生している問題・エラーメッセージ
公開したいのですが、CSSとJSが読み込まれず、JSの影響なのか挙動がおかしくなってしまいます。
JSで使用しているimgファイル以外はは読み込まれます。
該当のソースコード
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>NIKE</title> <meta name="description" content=""> <!--CSS--> <link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css"> <link href="https://fonts.googleapis.com/css?family=Philosopher" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <link rel="icon" type="image/x-icon" href="img/nike.png"> <script src="js/main.js"></script> <!--slick--> <link rel="stylesheet" href="css/slick.css"/> <link rel="stylesheet" href="css/slick-theme.css"/> <link rel="stylesheet" href="css/style.css"/> </head> <body> <header> <div class="header_box">～中略～
<div class="pickup_box"> <h2>PICK UP</h2> <ul class="slider"> <li><a href="#img1"><img alt="画像1" src="img/feature1.jpg" /></a></li> <li><a href="#img2"><img alt="画像2" src="img/feature2.jpg" /></a></li> </ul>～中略～
<footer> <div class="footer_box"> <h3>© Sneakers</h3> </div> </div> </footer> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script src="js/slick.min.js"></script> <script src="js/main.js"></script> </body> </html>フォルダの位置はこのような配置です。
それぞれの中身は
CSS
- slick-theme.css
- slick.css
- slick.scss
- style.css
img
- feature1.jpg
- feature2.jpg
js
- main.js
- slick.min.js
となっております。
ローカル環境では問題なく動作します。
試したこと
https://ugokawa.com/github-css/
こちらのサイトを参考にし、パスの変更を行いましたが駄目でした。
こちらが公開しているサイトとなります。
https://hiroo0121.github.io/portfolio_1/
回答1件
0
ベストアンサー
CSSという文字がソース上は小文字、ディレクトリ名は大文字になっているようで、変更したら無事表示されました。
とても綺麗なサイトだと思います！
投稿2021/07/01 15:49
総合スコア508
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/07/02 12:06
2021/07/02 12:25