Опустите изображения с мобильной версии веб -сайта Quarto ⇐ CSS

[Anonymous]

У меня есть веб -сайт Quarto, который я встроил в r. Веб -сайт работает, однако я включил изображения в боковую панель, которые большие и выходят перед моим текстом, когда я смотрю на мобильное устройство. Есть ли способ опустить изображения, когда они просматриваются на мобильном устройстве? < /P>
.

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

qmd

файл для одной страницы - следующее:

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

---
title: "Page1"
---

## Header

::: column-margin
![](images/image_1.JPG)
:::

*Text text text text

*Text text text text

*Text

![](images/image_2.jpg){fig-align="left"}

и мой файл yml является следующим:

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

project:
type: website
output-dir: docs

website:
title: "Title"
navbar:
right:
- href: index.qmd
text: Home
- page1.qmd
sidebar:
title: "Test Website"
style: docked
collapse-level: 2
contents:
- section: ""
contents:
- "index.qmd"
format:
html:
theme: Zephyr
embed-resources: true
toc: true
toc-expand: FALSE
toc-depth: 4
toc-location: right
toc-collapsed: false
grid:
sidebar-width: 300px
body-width: 1000px
margin-width: 500px
gutter-width: 1.5rem

editor: visual

с моим index.qmd просто:

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

---
title: ""
about:
template: solana
---

Есть ли способ иметь изображения в столбце-margin не отображаться при просмотре на мобильном телефоне? Или они могут, по крайней мере, быть перемещенными до самого конца страницы, а не перемещаться перед текстом при просмотре на мобильных устройствах?

Подробнее здесь: https://stackoverflow.com/questions/793 ... to-website