如何設置DIV寬度的手風琴的圖像大小

我需要根據我將用作背景的圖像的寬度來設置DIV的寬度（高度是固定的）。很明顯，圖像比DIV更大。如何設置DIV寬度的手風琴的圖像大小

讓我試着解釋一下：

HTML

<DIV class="book"></DIV>

CSS

.book { 
    height:180px; 
    background: url("hh1.jpg"); 
    width: ??? 
}

現在的背景圖片「hh1.jpg」肯定的是，DIV較大。我可以使用「封面」屬性，但我想動態（通過PHP）設置DIV的寬度，以便它將始終顯示整個背景圖像。

所以我們假設我有一個180px的固定高度並使用1000（w）x1800（h）圖像，結果div應該是100（w）x180（h）px。如果我使用1200（w）x3600（h）px，div應該是60（w）x180（h）px，依此類推。

但爲什麼用PHP？你不能用JavaScript做到這一點嗎？ –

那麼，我試圖爲WP創建一個簡短的代碼，並且更喜歡在PHP中做一個簡單的數學計算。 – user3590313

你可以選擇總是足夠的最小寬度。在相對定位的容器中使用絕對位置，以便元素不會干擾文檔的流動。

<div class="cont"><div class="bg"></div></div> 
.cont{position:relative;}.bg(position:absolute; background: ....)

2014-07-20 14:53:31 twicejr

回答