×
  • 的CSS Flexbox–完整的初学者指南

  • Flexbox术语

    课程清单

    在本课程中,让我们看一下flexbox的术语,这些术语是对flexbox及其工作原理有正确的理解所必需的。

    实体

    当我们谈论flexbox时,我们主要有两个实体。
    父容器(我们称为湖北福彩容器)和直属子元素(我们称为湖北福彩项目)。
    Flexbox术语:实体
    如果我们看一个示例html

    的HTML
    
    <!-- container: flex Container -->
    <div class="container">
      <!-- item: Flex items -->
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
      <div class="item"></div>
    </div>
    

    父div是flex容器,子div是flex项

    Flexbox轴

    使用flexbox时,我们还会处理两轴
    主轴线& 横轴
    Flexbox术语:Axis

    主轴线

    默认情况下,主轴从左到右延伸,而交叉轴垂直于主轴并从上到下延伸。
    手动轴的起点称为主要起点,终点称为主要终点,它们之间的长度称为主要尺寸。因此我们可以说flex项目从主要起点流向主要终点,并占据主要长度。

    横轴

    类似地,对于交叉轴,我们有一个交叉起点,一个交叉终点和一个交叉尺寸。我们还可以更改主轴和横轴的方向,但是我们稍后将在本章中进一步讨论。

  • 启用通知    不用了,谢谢