flex学习总结

发布时间 2023-09-05 06:01:06作者: o李一波o

参考资料:https://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

需求1:子元素实现从右到左排列(或者从下到上排列)

dicContainer: {
  display: flex;
  flex-direction: row-reverse;
}
// 延申:
// 1.写在contaniner有6个属性:3个flex-,2个align-,1个justify-content
// 2.flex-direction: row(默认) | row-reverse | column | column-revers
// 3.flex-direction: row-reverse与justify-content: flex-end的区别
//   flex-direction: row-reverse坐标轴反转,123 -> 321排列
//   justify-content: flex-end坐标轴不反转,123 -> 123排列