弹性盒布局

弹性盒布局
// 设置窗体的大小
@mixin setWindowSize(
  $width: null,
  $height: null,
  $minwidth: null,
  $maxwidth: null,
  $minheight: null,
  $maxheight: null
) {
  width: $width; // 宽度
  height: $height; // 高度
  min-width: $minwidth; // 最小宽度
  max-width: $maxwidth; // 最大宽度
  min-height: $minheight; // 最小高度
  max-height: $maxheight; // 最大高度
}

// 设置弹性布局
@mixin setFlexModel($justify, $align, $direction: null, $wrap: null, $content: null, $items: null) {
  display: flex; // 弹性布局
  justify-content: $justify; // 主轴对齐
  align-items: $align; // 侧轴对齐
  flex-direction: $direction; // 伸缩方向
  flex-wrap: $wrap; // 定义行数
  align-content: $content; // 伸缩行对齐
  justify-items: $items; // 同上
}
View Code

弹性盒布局

 

 

弹性盒布局

 

 

 参考网页——一篇文章弄懂flex布局 - 听风是风 - 博客园 (cnblogs.com)

上一篇:百度Ueditor编辑器 从word中复制内容带多张图片


下一篇:检查环境函数目录是否可写