我應該只給像素爲不同大小的最小高度和最大高度？

這裏是例子我應該只給像素爲不同大小的最小高度和最大高度？

<div id="parentContainer" style="height:100%;width:100%"> 
<div id="childContainer" style="height:98%";width:100%> 
<div id="list" style="min-height:20%;max-height:90%;color:red;"> 
Hello, this contains the web page content 
</div> 
</div> 
</div>

的問題是，我的一個同事說事象保證金，最小高度和最大高度必須在一個響應式設計的像素被賦予只是爲了確保佈局不會隨着各種屏幕尺寸和瀏覽器而變化，但是我的決定是，適合各種屏幕尺寸的佈局以css值爲百分比是正確的方式，因爲如果屏幕分辨率較低，20px可能看起來更大但對於更高分辨率的屏幕，它不會像預期的那樣在低分辨率屏幕中看到。如果我錯了，請糾正我，因爲我正在尋找正確的方法。

來源

2017-07-15 vishalaestro

您可以使用百分比min|max-width和min|max-height。

這樣，

min-height: 100% !important; /* browser fill */ 
max-height: 100%; 
min-width: 100%; 
max-width: 100%;

更多信息請參閱本，

simple docs

來源

2017-07-15 14:11:06

是否有任何特定的情況下，應該使用px？我不使用px任何地方在css中，字體大小事件我使用vw使字體大小響應沒有媒體查詢。 – vishalaestro

在圖像中我使用了px，如果它的佈局，請使用瀏覽器填充百分比...查看此鏈接https://www.w3schools.com/cssref/css_units.asp對於css單元（px，％，vw等） –

你的同事是在暗示像素的原因是，雖然這是一個很好的理論，即指定的百分比大小會使事情規模和響應性地佈置，實踐中效果不佳，因爲結果是不可預測的。使用像素尺寸時，您可以擁有更多的控制權，而現代框架旨在將容器保持在固定尺寸。使用的主要技術是當容器不能水平放置在屏幕上（並且在某些情況下顯示和隱藏不同的容器）時，將容器基本上流入「行」。

最小高度和最大高度確實是爲了確保任何特定容器的尺寸是可預測的，這可能是由於各種原因（特別是爲了確保元素在縮放時不會變得太大或太小），而這個可能是構成響應式設計策略的一部分。

看看Twitter引導作爲一個框架（尤其是網格系統https://v4-alpha.getbootstrap.com/layout/grid/）。

另請參見flexbox（CSS技術）。這裏有一個有趣的方式來學習它 - http://flexboxfroggy.com/

來源

2017-07-17 04:26:36

確實使用px只適用於最大和最小高度或一切？例如：字體大小，高度，寬度等等，那麼如果以像素表示所有內容是正確的選項，那麼在什麼情況下百分比是有用的 – vishalaestro

我應該只給像素爲不同大小的最小高度和最大高度？

回答

相關問題