CSS布局

布局流程图

原则

  • 没有设计稿 不写代码
  • 不到万不得已，不要写死 width 和 height
  • 尽量用高级语法，如 calc、flex
  • 如果是 IE，就全部写死

口诀

  1. float(IE5)
    1. 儿子全加 float: left （right）
    2. 老子加 .clearfix
  2. flex
    1. 老子加 display: flex
    2. 老子加 justify-content: space-between;

如果宽度不够，可以用 margin: 0 -4px;
(但是做移动端的时候会有滑动现象出现 加overflow:hidden;)

.clearfix:after{
    content: '';
    display: block;
    clear: both;
}
.clearfix{
    zoom: 1;
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容