Tailwind css 学习备忘

flex布局加在父元素上这个父元素变成 flex 容器它的直接子元素变成 flex 项目且只影响直接子元素默认直接子元素横向排列从左到右。默认主轴水平方向交叉轴垂直方向。justify-* 控制主轴对齐items-*控制交叉轴对齐加在父容器上而不是子元素。只写 justify-center 但父容器不是 flex 布局样式不会生效。justify-center 作用是把子元素在主轴方向居中。在容器上同时加上flex和flex-colflex开启弹性布局flex-col把排列方向设为纵向。在某个 flex 父容器的直接子项上加了flex-1它会自动撑满剩余宽度/高度bg-white/70表示白色背景 70% 不透明度。transition不是让元素动起来而是让某个 CSS 属性的变化变得平滑。过渡常见属性color、background-color、opacity、transformtransform用来对元素进行几何变换常见有平移translate、缩放scale ...button classNamemd:hidden/在md及以上屏幕隐藏这个按钮min-width: 768px