Blogger 動態視圖（馬賽克主題）：如何在移動設備上獲取全寬圖像？

Question

我的 Blogger 網站鏈接是： https://testfnm11.blogspot.com ，它基於 Blogger 動態視圖馬賽克主題。

在手機上查看本網站的頁面時，我希望圖像邊對邊顯示，以便使用手機屏幕的整個寬度。

作為顯示我想要的示例，我在我的另一個 Blogger 網站上實現了這一點： https://www.firozemistry.com使用 SOHO 主題。 我通過使用 CSS 代碼做到了這一點，但該代碼不適用於動態視圖主題。

ps：供您參考，我在我的 SOHO 主題網站中用來獲取邊到邊圖像的 CSS 代碼是：

@media screen and (max-width: 1162px) {
body.item-view .post-body a[imageanchor="1"] img {
    margin: 0 -30px;
    max-width: calc( 97% + 60px);
    }

有人可以給我一個 CSS 代碼或 HTML 修改，以實現邊緣到邊緣圖像嗎？ 我將不勝感激。

提前致謝！

最良好的祝願， Firoze Mistry

Answer 1

嘗試這個

@media screen and (max-width: 1162px) {
  .article .article-content img {
    padding: 10px 0 !important;
    margin: 10px -50vw !important;
    max-width: 100vw !important;
    border: 0 !important;
  }
}