彈性佈局：

如何一個容器都可以指定為彈性佈局，當我們為父盒子設定為彈性佈局之後，子元素的float，clear，vertical-align屬性將失效

通過給父元素設定flex屬性，來控制子盒子的排列方式與位置

flex父項屬性：

flex-direction - 設定子元素的排列方向(設定主軸x或者是y)

  <style>
      .father {
          display: flex;
          flex
 
-direction: row(預設值);
      }
  </style>

justify-content - 設定子元素的排列方式，是根據主軸排列的，x或者是y(類似於浮動，但比浮動更高階)

      .father {
          display: flex;
          justify-content: flex-start(預設值);
      }
 

flex-wrap - 設定子元素是否換行，預設不換行，寬度不夠會縮小子元素的寬度

align-items - 設側軸的排列方式

 單行起作用的屬性(flex-wrap：nowrap)

多行起作用的屬性(flex-wrap：wrap)