HTML 默认的排版方式，不能够满足需求。所以我们要更高级的表现形式。这些是盒模型的变易之道。

    还记得吗，盒模型有三个关键点，margin border padding 。这里讲述的变易的方法，还要从这个盒模型做起。为了演示方便，我就以div 和 span 这两个万金油来说明。

    变易有这么几种形式：

    1.    大小位置变化，与其他元素的间距变化。

    2.    显示隐藏的转化。

    3.    块独占行，非独占行变化。

    4.    形状的变化。比如由矩形变圆形。

    5.    颜色字体变化。

    6.    长文本换行变化。文字段落的行和行高变化。

    7.    水平，垂直对齐。

    如果你看的快的话，那么应该已经知道了，这些变易都是通过style这个属性来制定的。或者写在css 里面。至于不知道也没有关系。慢慢来，不理解的东西，看的多了，用的多了，习惯了，也就那样了。所谓理解，很多时候只是消除陌生感。

    首先看的简单的，大小和位置变化。

HTML 学习第三步变易