スライドショーを作成しており。パスはうまくできていてスライドは機能しているが画像がうまく表示されないため表示できるようにしたいです。

前提・実現したいこと

試したこと

拡張子をjpgからpngにしてみた。

コード

<div class="keyvisual" > <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li> <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> </ol> <div class="carousel-inner"> <div class="carousel-item active"> <img src="img/筋トレ.jpg" class="d-block w-100" alt="..."> <div class="carousel-caption d-none d-md-block"> <h5>First slide label</h5> </div> </div> <div class="carousel-item"> <img src="img/読書.jpg" class="d-block w-100" alt="..."> <div class="carousel-caption d-none d-md-block"> <h5>Second slide label</h5> </div> </div> <div class="carousel-item"> <img src="img/早起き.jpg" class="d-block w-100" alt="..."> <div class="carousel-caption d-none d-md-block"> <h5>Third slide label</h5> </div> </div> </div> <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev"> <span class="carousel-control-prev-icon" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next"> <span class="carousel-control-next-icon" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </div>

Takumiboo

2020/10/28 07:38

Railsに関連する質問であれば、質問に適切なタグを付与してください。

行動規範の内容に同意します

回答3件

ベストアンサー

ほぼ画像のおいてある場所とファイルパス指定のミスマッチが原因だと思われますので、再度確認してください。
ファイル構成の提示がない限り的確な回答はできません。

なお日本語のファイル名もトラブルのもとなので、Webではあまり使いません。

スクリーンショットを見たところ、Railsですか？
Railsに詳しくはありませんが、Railsのお作法に従う必要があるようです。
https://qiita.com/d0ne1s/items/0af5e99feafd5172d8ce
https://qiita.com/hacchi56/items/b2cc210ed3978fe0b126

投稿2020/10/28 07:18

編集2020/10/28 07:34

Takumiboo

総合スコア2534

keibooooou

2020/10/28 07:27

回答ありがとうございます！ファイルの構成追記させていただきました！

Takumiboo

2020/10/28 07:32

回答として投稿してしまっています。質問文の編集ができるので、そちらに記述を移し、回答は削除リクエストを出してください。スクリーンショットを見たところ、Railsですか？ Railsに詳しくはありませんが、Railsのお作法に従う必要があるようです。 https://qiita.com/d0ne1s/items/0af5e99feafd5172d8ce https://qiita.com/hacchi56/items/b2cc210ed3978fe0b126

行動規範の内容に同意します