CSS尺寸的最佳實踐 - 元素高度/寬度（像素或％）

Question

我的問題是關於設置元素大小的最好方式，我應該將其設置在％或PX？

我在做我的工作中的一個web應用程序，我設置每個高度/寬度的百分比。這是最好的方法嗎？

通過最好的我的意思是正確地顯示各種顯示器的尺寸和分辨率，並跨瀏覽器。

示例代碼：

html 
{ 
    height:100%; 
} 

body 
{ 
    height:100%; 
} 

div.title 
{ 
    background-color:Gray; 
    padding:0; 
    margin:0; 
    float:left; 
    width:100%; 
} 

form#ct101 
{ 
    height:100%; 
} 

它的推移一路下跌。

謝謝

Answer 1

這真的取決於你想要做什麼。例如，對於內容標籤，我通常喜歡使用80-95％。如果我正在製作登錄屏幕，則根據頁面其餘部分的外觀，我會使用30-40％或固定寬度。

Answer 2

我知道這個問題是舊的，但在一個不相關的谷歌搜索沒有答案想出了......

我會離開100％是罰款，只要高度的形式出現在屏幕上的唯一的事..這將真正獨立於你的應用程序。寬度，另一方面...

使用@media，您可以設計您的移動和桌面上的人的形式。

例如：

@media screen and (max-width: 645px) { 
form#ct101 { 
width: 100%; 
} } 
@media screen and (min-width: 646px) { 
form#ct101 { 
width: 600px; 
} } 

這將使你的表單填寫在屏幕上的移動設備，使他們有最大的空間，看到他們，然後讓他們沒有那麼大的顯示器，因此表單輸入AREN」不長。理論上，表格字段越長，它被認爲填寫的時間越長，並且會從表格中消失/反彈。