500px.com計數集合（或專輯）中的圖像數

我有一個艱難的時間，試圖找出如何做出完美的計算，並基於它調整我輸出到模板的div塊（ HTML）與PHP代碼。500px.com計數集合（或專輯）中的圖像數

這裏是什麼，我試圖做一個照片： enter image description here

不過，我正好不知道如何使這個輸出如此精確與數學和計算。如果有人知道這是如何按百分比計算的，那麼請隨時就此分享數學，謝謝！

來源

2014-06-16 John Smith

究竟輸入和輸出是什麼？ – Fabricator

這些是帶有圖像標籤的DIV和UL LI。然而，我試圖弄清楚這個數學問題，我傾向於使用較少數量的圖像，不幸的是，我的代碼很多，並且有很多if語句，但是，如果有數學方法，可以隨意分享。 –

我不確定這是你想要的，因爲它不是基於％寬度，但我相信它會把你放在正確的軌道上。

JSFiddle Demo

HTML：

<div class="container"> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
    <div class="image"></div> 
</div>

CSS：

.container { 
    width:900px; 
    height:220px; 
} 
div .image { 
    width:100px; 
    height:100px; 
    background:#cdcdcd; 
    display:inline-block; 
} 
div .image:nth-of-type(1) { 
    min-width:205px; 
    min-height:205px; 
    float:left; 
    margin-right:5px; 
} 
div .image:last-of-type { 
    background:#0099FF; 
    color:#fff; 
}

您可以輕鬆地適應這個以％寬度，以滿足您的需求，但因爲你發佈任何代碼我沒有任何工作。讓我知道這是否能解決您的問題。

來源

2014-06-16 20:02:48

酷，除了這不是問題，此外，我使用ul li不divs，容器是一個div。事物代表數據，例如3張圖片中，第一張是較大的（50％），另外兩張分開的是50％/ 2，但即使總圖像的數量是4等，我也想要類似的顯示。 –

好吧，我說你可以根據自己的需要調整它。將寬度/高度更改爲百分比並添加實現它的方式。如果你沒有顯示任何代碼，我不會爲你寫網站。 –

@JohnSmith您可以將CSS更改爲Div中的ul li。您可以將寬度更改爲百分比。這可能是你會得到的唯一答案，因爲這個問題措辭不佳。 –

500px.com計數集合（或專輯）中的圖像數

回答

相關問題