1.左右布局
上图就是一个典型的左右布局，左图，右content；
1.用一个<div>包裹住两个<div>，两个<div>在其中实现左右布局，一个放图片，一个放文本；
2.主要用到两个style：
div{ float: left; }
.clearfix::after{ content: ''; display: block; clear: both; } /* 为了消除浮动 */
简历demo（检查元素查看）
2.左中右布局
这个勉强也算作左中右布局的一种，两边留白，中间内容居中，主要用到三个style：
max-width: 940px;
margin-left: auto;
margin-right: auto;
max-width是限定了中间内容的最大宽度，由于当前有布局居中需求，所以左右用auto来自适应，如果不需要，可自拟。
3.水平居中
直接给<div>包裹住的内联文件一个style：
text-align：center；
所以存在一个问题，如果<div>中包裹的也是<div>呢？
这种情况，就需要用到 display：inline-block; 将<div>元素转变为内联元素，再对其进行居中；
4.垂直居中
通过verticle-align:middle实现CSS垂直居中。
通过vertical-align:middle实现CSS垂直居中是最常使用的方法，但是有一点需要格外注意，vertical生效的前提是元素的display：inline-block。
方法有多种，这里取其一；
5.小技巧
css的布局是否顺利流畅很多时候与选择器class的布局有关；
遇到问题多往文档流的方面思考。
