Flex布局教程:语法篇(参考文档:阮一峰)(慢慢整理)

1,318 阅读1分钟

参考文档:

  • www.ruanyifeng.com/blog/2015/0…
  • css-tricks.com/snippets/cs…
  • scotch.io/tutorials/a…
  • 1.Menu and content dynamic(菜单和内容都是动态的)
  • 2.Menu fixed,Content dynamic(菜单是固定的,内容是动态的)
  • 3.Menu and content dynamic(菜单和内容是动态的)
  • 4.columns,all dynamic(三列都是动态的)
  • 5.4 columns,all dynamic(四列,所有的都动态的)
  • 6.Menu floating
  • 7.Menu fixed,content&header dynamic(菜单固定,内容和头部是动态的)
  • 8.3 columns fixed centered(3列固定居中)
  • 9.dynamic with header and footer(动态与页眉和页脚)

实例(写项目实际上能用到的):

  • 1.justify-content:属性定义了项目在主轴上的对齐方式.
  • justify-content:flex-end(右对齐)
    上图上图