桌面：水平圖片/內容，智能手機：垂直畫面/內容

Question

我使用WordPress的響應準備的主題，它工作得很好，除了表或DIV容器。

我主要的問題是我的桌子上，如下所示：lichtundmusik.ch/vermietung/licht

我想要什麼： 當我看同一頁提到上述智能手機上的圖片應該automaticaly更改文本和圖片的順序從橫向到我想要的垂直

插圖：Link to the Illustration

還有一個難點： 它是當今firt一次我來到一個交叉引導，我試圖實現它可惜進入靴網站標題中的陷阱代碼正在改變整個網站。

是否有人對我的解決方案？謝謝您的回答

Answer 1

因爲你的輸出是一個表，你將不得不玩一些技巧用CSS來完成這項工作。 CSS-Tricks has a nice article explaining the basics。 TL; DR，你需要爲你的CSS小屏幕，把你的表格單元格成塊元素創建另一個媒體查詢：

@media only screen and (max-width: 760px) { 
    /* Force table to not be like tables anymore */ 
    table, thead, tbody, th, td, tr { 
     display: block; 
    } 
} 

對於第二部分，引導是一個巨大的框架和將改變一切。對於我沒有批量需要響應能力的項目，我一直在使用Pure CSS，它在4.4KB包中提供了許多響應式功能。