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

[Anonymous]

Я хочу добавить гиперссылки в изображения в блоке, которые переключаются с помощью переключения темного/света. Я использую модифицированный шаблон, сгенерированный из Jekyll Chirpy-Starter .
У меня есть два случая:

случай 1 (Синтаксис разметки)

[{: .dark .w-25 }](https://example.com/source)
< /code>
Hyperlind Works < /strong>

CSS -классы (.dark .w-25) не работайте

case 2 (html syntax)

< /code>
гиперссылка не работает < /strong>

CSS -классы (.dark w-25< /code>) Работать < /strong> < /p>
желаемое поведение: < /h4>

• Гиперссылка должна работать.
  
  Нажатие на изображение откроет гиперссылку на новой вкладке вместо обычного всплывающего окна в чирпи Theme.

< /li>
[*] CSS -классы изображения (.dark .w-25< /code>) должен работать.

• .dark: изображение должно отображаться только в темном режиме.
• .w-25: ширина изображения будет уменьшена до 25%.

Операции я уже пробовал
, чтобы у меня были работа, работающие гиперссылкой и CSS [/b], я попробовал:




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

Click the image to go to the source.

1.
[{: .dark .w-25 }](https://example.com/source)

2.




Solution (?)




< /code>
HTML преобразование содержания тела похоже на: < /p>


.content ul, .content ol {
text-align: left !important;
}


Click the image to go to the source.

1.




2.





Solution (?)








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