您是否應該主要使用邊距/填充或定位來設計HTML和CSS佈局？

在創建HTML5和CSS3設計時，最好是在定位或其他方式上爲設計使用邊距和填充效果？您是否應該主要使用邊距/填充或定位來設計HTML和CSS佈局？

我從來沒有真正想過這個問題之前，並同時使用這一側獲得在需要的結果，但它可能如下面的例子中以兩種方式來設計：

HTML

<div> <ul> <li><span>1</span></li> <li><span>2</span></li> </ul> </div>

CSS實施例1 - 使用餘量，填充

div{ 
    width:1000px; 
    margin:auto; 
    } 
ul{ 
    margin-left:10px; 
    width:100px; 
    } 
li{ 
    height:30px; 
    } 
span{ 
    margin-top:10px; 
    }

CSS例2 - 只需使用定位（除保證金：自動..）

div, ul, span{ 
    position:absolute; 
    } 

div{ 
    width:1000px; 
    margin:auto; 
    } 
ul{ 
    left:10px; 
    width:100px; 
    } 
li{ 
    height:30px; 
    } 
span{ 
    top:10px; 
    }

來源

2012-03-29 Dan

對於一個典型的頁面佈局，例1更清潔，你應該選擇那個，給出選擇。

示例2很糟糕，因爲只要您開始設置position: absolute就可以了，您的設計可能具有的任何靈活性都會消失。你必須設置明確的尺寸。

一般情況下（有例外），主要佈局應避免使用position: absolute，除非它是唯一的方法。

Here's an example我說的是那種問題。 It would appear用戶最終使用JavaScript來解決他的問題。不好。

來源

2012-03-29 09:52:02 thirtydot

的經驗法則，position規則是最適合的，他們的名字所暗示的。

margin由於各瀏覽器之間的模型不一致，因此不太適合此目的。

話雖如此，大多數佈局技術都是這兩者的混搭，並且兩者都結合使用。

來源

2012-03-29 08:58:52

以上全部。定位適用於彈出或可以動態創建的事物。有時定位實際上是派生的放置。填充和邊距通常用於如何將這些元素與其他元素相關聯。所以一個項目可以有填充，邊距和定位，並且所有這些屬性都與元素相關。

一個常見的主題是獲取客戶端環境，然後根據與其可視區域的關係進行設計。

請參閱此鏈接https://stackoverflow.com/a/8857735/1026459以獲取客戶端屏幕大小（跨瀏覽器兼容）。

來源

2012-03-29 08:59:54

您是否應該主要使用邊距/填充或定位來設計HTML和CSS佈局？

回答

相關問題