其实讲到这里啊，我们布局都讲的差不多了呢~
你也许觉得诧异，然而，竖排的话简单吧，横排我们也学了，也练习了。横竖交错组合就足够应付日常的排版需求了呀。我们继续讲，也只是对上面内容的重复，不信？那我们试试看——
我们现在有了页头和导航，下面如果只是文章内容的话……
<content>在这里面放内容</content>content {width: 800px;margin: 10px auto;padding: 30px 0;}我给内容区域一个确定宽度，把它居中就好啦，下面放页尾，也十分类似。你说里面的内容？不浮动就垂直排列，浮动就排满一行再排下一行，最后记得清除浮动就对了。
当然我说的很简略，你们最好还是自己动手操作一下，理论就是这么个理论，但是实际使用中的细节问题，还得自己去体验一番才能够真正理解。
如果一边是内容，另一边是侧边栏，那就先让这两者横排一下。唔，翻来覆去就这么点操作而已，关键在于对区域的合理划分。
虽然我们理论讲的不算细致，但是大部分东西都是提到了的，动手试试，细致思考一下，现在普通的排版是完全拦不住你的哦~
但是这一章这么点字是不行的（你们会说我偷懒啊），我们来聊一聊布局这个事情，让大家对后面有一个了解。
我们现在做的呢，是一个平面上的排版，有点像华容道，或者拼图。什么意思呢？就是同一个位置，有了这个东西，就不能有那个东西，而且我们基本会用各种元素（包含元素的内补、外补），把这个界面填满。做出来类似报纸的效果。
但这已经很厉害了，比如你随便打开一个电商平台的首页，截图下来，然后尝试一下，你会发现你都能仿的下来（忽略动态和交互的前提下）。所以，现在这些看起来很简单的东西，绝对是基础，还是很重要的基础，真心建议大家试着去排版几个页面，这对于后面的学习会有很大的帮助。千万不要在还没掌握这部分的情况下贸然地学习后面的内容。
后面呢，我们还会有立体的布局，就是可以层层叠叠的，技术上一点都不难，但是如果你前面的内容没有掌握牢靠，再加上后面的内容，就有些混乱。等到应用的时候，就不是一个细节在起作用，而是所有的细节在相互作用，那时候出现问题就很难找到。所以先多熟悉这部分内容，是学好下一部分内容的前提。
然后是动态的布局，就是自适应、响应式，总之根据显示区域尺寸的不同，表现出不同的排版。里可以理解为多个排版的叠加。这差不多就是 4D 了。（平面为 2D，层叠以后是 3D，再加上一个变化因素，4D，没毛病）
到这里，我们才把基础排版讲完。还有一种新的排版方式必须掌握，以及另一种新的排版方式作为了解……
好了，划重点哦。上面说的你可能并不是很明白，这不重要。记住：现在必须开始动手练习才能学会，必须熟练掌握当前知识，才能去看下一个知识点，否则会混乱。
暂无评论内容