发表于: 2018-06-05 21:12:18

1 608


今天完成的事情:

  今天上午的时候就推送了一个微信文章,然后看了一下任务,改了一下。下午的时候玩了个游戏,看了游戏需要的内容及其应用场景。
明天计划的事情:

 开始任务七
遇到的问题:

 还没有 
收获:

这是总结的属性及其应用在什么地方

justify-content 属性

justify-content 用于设置或检索弹性盒子元素在主轴(横轴)方向上的对齐方式

align-items 属性

align-items 属性定义flex子项在flex容器的当前行的侧轴(纵轴)方向上的对齐方式。

align-self 属性

align-self 属性定义flex子项单独在侧轴(纵轴)方向上的对齐方式。

flex-direction 属性

flex-direction 属性规定灵活项目的方向。

flex-wrap 属性

flex-wrap 属性规定flex容器是单行或者多行,同时横轴的方向决定了新行堆叠的方向。

order 属性

order 属性 设置或检索弹性盒模型对象的子元素出现的順序。

flex-flow 属性

flex-flow 属性是 flex-direction 和 flex-wrap 属性的复合属性。

flex-flow 属性用于设置或检索弹性盒模型对象的子元素排列方式。

flex-direction 属性规定灵活项目的方向。

flex-wrap 属性规定灵活项目是否拆行或拆列。


这几个属性都是FlexBox

看了一下他应用的场景

特性如下:
  1. 可以在垂直或者水平方向以任意一种对齐方式进行样式布局
  2. 可以在单一轴线上布局也可以在多行内布局
  3. 随可用空间的变化进行响应式布局(能够调整其子元素的宽度或者高度以使其能在不同分辨率的屏幕下能用最好的方式去填充可用空间)
适用场景:
  1. Flexbox适用于包含有多个元素的盒子的样式渲染
  2. Flexbox适用于在子元素的尺寸未知或者动态的情况下,对子元素的对齐方式、排列方式以及排序顺序进行控制展示



返回列表 返回列表
评论

    分享到