html5のpictureタグで、画像が表示されない

前提・実現したいこと

レスポンシブ（768px以下）での表示画像を切り替えたい

発生している問題・エラーメッセージ

画像が反映されません

該当のソースコード

php
1<picture class="item">
2  <a href="/plan#review-anc">
3    <source srcset="<?php echo get_template_directory_uri(); ?>/img/sec1-button1.png" media="(min-width: 768px)">
4  　　 <source srcset="<?php echo get_template_directory_uri(); ?>/img/sec1-button1-sp.png" media="(min-width: 240px)">
5   <img src="<?php echo get_template_directory_uri(); ?>/img/sec1-button1.png" alt="志望理由書添削ボタン">
6  </a>
7</picture>
8
9--以下PC用のcssーー
10.sec1-button-wrap img {
11  width: 100%;
12}

補足情報（FW/ツールのバージョンなど）

画像のファイル名に間違いはありませんでした。
よろしくお願い致します。

m.ts10806

2021/08/19 09:55

＞画像のファイル名に間違いはありませんでした。どのように確認されたのでしょうか。パスも含めて「ファイル名」です。 imgのsrcに設定された内容で直アクセス確認してください。

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

回答1件

少なくとも文法的にこうではないでしょうか。

HTML
1<a href="/plan#review-anc">
2  <picture class="item">
3    <source srcset="<?php echo get_template_directory_uri(); ?>/img/sec1-button1.png" media="(min-width: 768px)">
4  　　 <source srcset="<?php echo get_template_directory_uri(); ?>/img/sec1-button1-sp.png" media="(min-width: 240px)">
5   <img src="<?php echo get_template_directory_uri(); ?>/img/sec1-button1.png" alt="志望理由書添削ボタン">
6  </picture>
7</a>

投稿2021/08/19 10:57