相关疑难解决方法(0)

今天我正在查看我构建的'Tabs'HTML小发明,我注意到因为我使用内联块来布局标题页,当它们换行时,我会得到如下所示的输出:

  +-------+  +--------+  +--------+  +------+  +------------+  +-----+
  | Apple |  | Banana |  | Cherry |  | Date |  | Elderberry |  | Fig |
  +-------+  +----------+
  | Grape |  | Honeydew |
--+       +--------------------------------------------------------------

没问题,我想:我打赌我可以使用flexbox使它更干净地包裹,以便第二行超过第一行,使它看起来像是在用户的第一行"后面",如下所示:

  +-------+  +----------+
  | Grape |  | Honeydew |
  +-------+  +--------+  +--------+  +------+  +------------+  +-----+
  | Apple |  | Banana |  | Cherry |  | Date |  | Elderberry |  | Fig |
--+       +--------------------------------------------------------------

这并不完美,但它也不错,它模仿Tab控件在Windows中的作用.

所以我修改了几行flex CSS并且达到了我需要做的就是添加任何指定行从下到上的flexbox属性,然后我就完成了.我得到了这个:

ul.fruits {
  display: flex;
  flex-flow: …