如何在CSS中實現這個邏輯？

Question

我想要兩個div，第一個是大方形，第二個是小方形。 而第二個是在大的裏面。大方塊至少640px，如果> 640px，它將獲得80％的屏幕寬度。第二個的寬度是大方形的寬度-200px。

我可以在CSS中實現這個邏輯嗎？或者我需要一個JavaScript來動態設置它？謝謝。

Answer 1

你談論的方格應該是真實的方格（寬度==高度）還是隻關心寬度和矩形也可以？在後一種情況下，這可以用純CSS來實現：

#big{ 
    width:80%; 
    min-width:640px; 
    padding:100px; 
} 
<div id="big"> 
    <div id="small"> 
    </div> 
</div> 

看到它在這裏的行動：http://jsfiddle.net/2evFx/