乾淨地調整大小隱藏頁面元素

Question

我有一個包含幾個任意大小的內容塊的頁面。有沒有一種方法，我可以：

1. 允許這些塊來調整或大或小，以填補所有可用空間作爲窗口大小的變化，
2. 指定每個塊的最小尺寸，
3. 隱藏在指定的最小尺寸不適合頁面時完全阻止。

我完全控制了HTML和CSS。我強烈希望沒有Javascript的解決方案。

Answer 1

@dark;可能你需要一個流暢的網站。所以，

1）給width百分比，而不是px到div爲重新大小較大&較小。 檢查更http://www.smashingmagazine.com/2009/06/09/smart-fixes-for-fluid-layouts/

http://www.alistapart.com/articles/fluidgrids/

2）是的，你可以定義min-width爲您塊像

.block{ 
min-width:20%; 
} 

3）對於某些窗口大小設計隱藏塊或更改你必須定義分鐘寬度或最大寬度在media query。 檢查鏈接

http://www.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

http://www.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/

http://nathanstaines.com/demo/media-queries.html

http://css-tricks.com/css-media-queries/

Answer 2

對於第一個，您可以使用％值設置width和height。這將導致「塊」調整爲「窗口大小改變」。對於第二個，您可以設置min-width和min-height，這樣無論窗口的大小如何，塊都不會縮小到您指定的值以下。至於第三，你將不得不使用JavaScript。