css常用样式（保持更新）

注意：class只有高度宽度信息
<!--上下居中-->
方法1：该方法得知道居中元素的宽度
<div class="box" style="position: relative;">
<div class="sub-box" style="position: absolute;top: 50%;margin-top:-50px;"></div>
</div>
方法2：该方法啥都不用知道
<div class="box" style="position: relative;">
<div class="sub-box" style="position: absolute;top:0;bottom:0;left: 0;right: 0;margin: auto 0"></div>
</div>
方法3：该方法需要套多一个额外的div，且这个div的高度跟居中元素的高度一致
<div class="box" style="position: relative;">
<div class="sub-box" style="position: relative;top: 50%;">
<div class="sub-box" style="position: absolute;top: -50%;"></div>
</div>
</div>
<!--左右居中-->
<div class="box">
<div class="sub-box" style="margin: 0 auto;"></div>
</div>
<!--清除浮动样式-->
<style type="text/css">
.clearfix:after { content: ''; display: block; clear: both;visibility: hidden;} .clearfix{zoom: 1}
</style>
<!--未知高度图片居中-->
<div class="box" style="display:table-cell;text-align:center;vertical-align:middle;">
<img src="" alt="" style="vertical-align:middle;"/>
</div>