Добавить гиперссыщенное изображение с классами CSS в jekyll Chirpy Theme ⇐ Html

[Anonymous]

Я хочу добавить гиперссылки в изображения в блоке, которые переключаются с помощью переключения темного/света. Я использую модифицированный шаблон, сгенерированный из jekyll chirpy-starter < /code>. < /P>

желаемое поведение: < /h4>
[list]
Пари изображение с курсором не покажет путь к изображению или обычный всплывающий курсор. li>
[/list]
Я имею два случая:
case 1 (синтаксис разметки)

Код: Выделить всё

[![Alt Text](/assets/images/header/dark.webp){: .dark .w-25 }](https://example.com/source)
< /code>
✅ [b] Hyperlind Works < /strong>

❌  CSS -классы (.dark .w-25

) не работайте [/b]

case 2 (html syntax)

Код: Выделить всё

[url=https://example.com/source]
[img]/assets/images/header/dark.webp[/img]
[/url]
< /code>
❌ [b] гиперссылка не работает < /strong>

✅  CSS -классы (.dark w-25

) Работа [/b]
Операции I уже пробовали
, чтобы как

Код: Выделить всё

[url=https://example.com/source]
[img]/assets/images/header/dark.webp[/img]
[/url]

Затем, в _sass/mayout/urlimage.scss , я определил:
.mode-dark .dark-mode-img {
content: url('/assets/images/header/dark.webp');
}
< /code>
Но я не смог получить желаемый вывод. Что я могу сделать?


Подробнее здесь: https://stackoverflow.com/questions/794 ... irpy-theme