</aside>
然后,我们需要添加区域标记来标记内容流向什么区域。添加标记的区域是否高于或低于实际内容是没有什么影响的。
这里的意思是 假设有个div里面装了很多文字，你要把这些文字流向另一个div中，这个div放到哪都是无所谓的。
XML/HTML Code复制内容到剪贴板
<div class="regions cf">
<div id="region-1" class="region cf"></div>
<div id="region-2" class="region"></div>
<div id="region-3" class="region"></div>
<div id="region-4" class="region cf"></div>
</div>
CSS
在样式表中,我们指定区域的宽度和高度。高度是必须的，因为高度指定内容断点,否则内容不会流向其他区域。
这里的意思是高度规定这个容器能容纳多少内容，超过了则会流向其他容器。——@99
CSS Code复制内容到剪贴板
.demo-wrapper #region-1,
.demo-wrapper #region-4 {
width: 100%;
height: 250px;
}
.demo-wrapper #region-4 {
height: 400px;
}
.demo-wrapper #region-2,
.demo-wrapper #region-3 {
width: 50%;
height: 700px;
margin-bottom: 25px;
}
为了在区域内添加内容,我们使用新的CSS属性flow-into和flow-from。这些属性建立了内容和区域的桥梁。我们可以如下编写样式规则来使内容流向区域。
这个地方flow-into跟flow-from后面的单词是你自己定义的！比如说我想把a容器的文字流b c区域，我可以设置flow-into:a或者你能想象到的任何名称，之后用flow-from：你刚才用的名称。
CSS Code复制内容到剪贴板
article {
-webkit-flow-into: article;
flow-into: article;
}
.demo-wrapper aside {
-webkit-flow-into: aside;
flow-into: aside;
}
#region-1,
#region-2,
#region-4 {
-webkit-flow-from: article;
