Bootstrap4.5で設置したcarouselスライドの画像が変更出来ない

やりたいこと

作成しているWebページにBootstrapでcarouselスライドを設置したい

問題

Bootstrapのドキュメントからコピペしたcarouselスライドのimg部分がsvgタグになっていて、用意したimgファイルに入替が出来ない。

コピペしたBootstrap/Components/carouselは以下の日本語ドキュメントサイトを参照
https://getbootstrap.jp/docs/4.5/components/carousel/

⇓ With indicatorsからimg部分を抜粋 ⇓

<div class="carousel-item">
  <svg class="bd-placeholder-img bd-placeholder-img-lg d-block w-100" width="800" height="400" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: First slide"><title>Placeholder</title><rect width="100%" height="100%" fill="#777"/><text x="50%" y="50%" fill="#555" dy=".3em">First slide</text></svg>
</div>

※コードは(carousel-innerの中の１つのitem)


⇓ With captions ⇓

<div class="carousel-item">
  <img src="..." alt="...">
  <div class="carousel-caption d-none d-md-block">
    <h5>...</h5>
    <p>...</p>
  </div>
</div>

With indicatorsのcarousel-itemの中にWith captionsのimgタグとdivタグ(h2,p)を入れ子にすれば良いのか??と思い、実行したところsvgタグの描画は消えず、その下にWith captionsのimgタグで設定した画像が表示される。

環境

Windouws10
Bootstrap v-4.5

原因

Bootstrapのドキュメントからコピペしたcarouselスライドのimg部分が日本語ドキュメントサイトと英語ドキュメントサイトとで違っていた。
Bootstrap 日本語ドキュメントサイト　With indicatorsとWith captionsが分かれている記載されている
https://getbootstrap.jp/docs/4.5/components/carousel/

<div class="carousel-item active">
  <svg class="bd-placeholder-img bd-placeholder-img-lg d-block w-100" width="800" height="400" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: First slide"><title>Placeholder</title><rect width="100%" height="100%" fill="#777"/><text x="50%" y="50%" fill="#555" dy=".3em">First slide</text></svg>
</div>

※コードは(carousel-innerの中の１つのitem)


Bootstrap 英語ドキュメントサイト With indicatorsとWith captionsが分かれていない
https://getbootstrap.com/docs/4.5/components/carousel/

<div class="carousel-item active">
  <img src="..." class="d-block w-100" alt="...">
  <div class="carousel-caption d-none d-md-block">
    <h5>First slide label</h5>
    <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
  </div>
</div>

※コードは(carousel-innerの中の１つのitem)


比較すると日本語ドキュメントは画像部分がsvgタグとなっていて、英語ドキュメントは画像部分がimgタグになっている。

解決

英語ドキュメントのcarousel/With captionsをコピペして使用した。

あとがき

日本語版と英語版のどちらも公式のドキュメントだと思っていましたが、それぞれ違っている場合があるので注意が必要。