我的前端布局方法

    前些日子无聊的时候学了下前端，说实话没有美感前端和搬砖没有区别，唯一值得一提的就是他的布局方法。我的这个方法用于写死网页，不含各种框架的自适应性功能，而且主要想记录一下思想。

    写前端不同于算法优化，算法中经常是能少一个数组就少一个数组，而前端只要保证不乱，多套几个div没有任何关系，也没人会深究你浪费了几个div。所以基本上是每一个模块都套一个div，兄弟也好后代也好，有意义就套，只要自己不嫌麻烦就行。而且始终秉持一个思想，先布局后写内容，写每一块思路都要清晰，多写几遍谁都会熟练，再多总结把用的多的组件封装一下，不用动脑两三个小时出一套前端不成问题。

    布局思想方面，弹性盒子布局会减掉许多麻烦，主要是由于他的排列以及居中方式可以代替各种边距和浮动设置。手机端只需适应各种手机屏幕即可，所以稍微关注一下电脑端即可。分辨率最窄1024px，最宽1920px，写出的网页要想适应所有屏幕，最好的方法就是内容部分给一个最小宽度，然后两边留白，其实这也是当下淘宝等网页采用的方法。具体来说，就是整体内容外面包一个div，宽度一般1000左右，然后使用margin:0 auto;水平居中，当然也可以再做些媒体查询。

    对于整体布局，我这里封装了两种宽度，百分比式宽(fluidwidth)和固定长度式宽(containerwidth)。百分比式宽电脑端整体布局基本不用，只用于部分布局；移动端整体部分布局都用，但要防止有东西挤下来。固定长度式宽电脑、移动端都用于整体布局。

    对于div内部，我这里使用了center-all、justify、align等三种居中方式，能不用边距对齐就不用。至于div之间的排