0
我想有一個畫廊頁面，顯示一個網格的照片。照片的順序相當重要，需要按照從左到右的順序排列。另外，佈局需要具有響應性，根據頁面大小的不同列數。如果所有的照片都是風景，那麼這不是問題。目前，我正在做這個如下：響應式畫廊與景觀和肖像圖像
HTML
<div class="thumbcontainer">
<?php
for ($i=1; $i<=27; $i++){
echo '<a class="thumbnail" href="gallery/image.php?image=' . $i . '"><img src="gallery/thumbnails/image_' . $i . '.jpg" width="100%"></a>' . "\n";
}
?>
</div>
CSS
@media all and (min-width: 905px){
.thumbnail{
width: 19%;
}
}
@media all and (max-width: 904px){
.thumbnail{
width: 24%;
}
}
.thumbcontainer{
width: 100%;
display: block;
text-align: center;
padding-top: 3px;
}
.thumbnail{
display: inline-block;
text-align: center;
padding-bottom: 8px;
margin-left: 2px;
margin-right: 2px;
}
的問題是，我希望能夠有肖像圖片的網格太佔用兩排網格（它們的寬度與橫向寬度相同，高度也是兩倍），同時保持網格的響應性。例如，如果L表示橫向和P畫像，而數字表示圖像號，則網格可能看起來像這樣：
L1 L2 P3 L4
P5 L6 P3 L7
P5 L8 L9 L10
有沒有辦法做到這一點？我到處搜索，並絞盡腦汁，但無法事先了解所需的列數/行數以及訂單中肖像圖像的位置。任何指針將不勝感激。