如何让网页布局稳定性和标准性?

1.站在标准流的角度看padding 和 maring 、width等属性稳定性

我们知道页面布局的时候，控制盒子位置距离等，有盒子本身大小，padding和margin来做。

因此，再这里我们会根据稳定性来看这三者的先后顺序：

其中稳定性最好的就是盒子本身的高度和宽度了，我们优先考虑这个。 因此，很多情况下，我们会考虑利用高度剩余法，宽度剩余法来做，而不是padding和margin。

**这个评论和下面的文本域框有个小距离， 此时，我们给这个评论一个h2标签，高度正好从评论上方，到文本域上的高度就好了。

h2 里面文字内容默认是靠左上对齐的，高度用不了，就剩下了，这就是高度剩余法。**

其次，我们才考虑padding ，因为padding也可以看做特殊的盒子高度和宽度，最后我们再用margin来做。因为margin会有边距合并的问题。

2.标准流、浮动流和定位的稳定性

标准流再里面是最稳定的，就是块级元素上下显示，行内一行显示，都是最稳定的。

浮动和定位都“脱标”了，稳定性没那么稳定，所以，我们应该遵循如下原则：

页面布局，能用标准流去做的不用浮动去做，如果要用浮动做的，就不用定位去做。

3.清除内外边距

html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img { margin:0; padding:0; }