css的核心内容 标准流、盒子模型、浮动、定位等分析

通过CSS的设置把行内元素转换成块级元素：

标准流：就是标签的排列方式。
<div class="style2">我的未来不是梦</div>
<span id="st" class="style1">栏目一</span>
<span class="style2">栏目二</span>
<br />
<span class="style3 guaiji">阳光男孩</span>
<span class="style3 ">栏目三</span>
以上是标签的一个排列方式，以下是网页内容的呈现方式，它是以标签的排列方式来呈现的

这就是我们对标准流的理解（就象流水，排在前面的标签内容前面出现，排后面的标签内容后面出现）

盒子模型：

下面在CSS样式文件中设置边框border：
.style1, .style2, .style3
{
background-color: #FAFEB1;
border-width:2px;
border-color:Blue;
border-style:solid;
}
.guaiji
{
display: block;
}

以上对边框的设置可以简写为：border:2px blue solid;运行效果一样。
下面设置内边距padding:
.style1, .style2, .style3
{
background-color: #FAFEB1;
border-width:2px;
border-color:Blue;
border-style:solid;
padding:5px 0px 5px 10px;
}
.guaiji
{
display: block;
}