如何用css和html实现蛇形数据，刚开始从左到右排列，内容超出后从右向左排列。

Question

问题描述

有一个流程图，默认是从左向右，当超出div换行能不能从右向左显示，当再超出时再从左向右显示。

问题出现的环境背景及自己尝试过哪些方法

我实在没想到如何用div css实现，我用canvas在努力实现。

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

你期待的结果是什么？实际看到的错误信息又是什么？

Answer 1

ul:nth-of-type(2n){
    flex-direction: row-reverse;
}
ul 里面放置 li，一行一个ul，当ul是2的倍数时反转一下

Answer 2

demo:

https://github.com/giscafer/d...

思路，偶数行反向flex-direction 布局即可

Answer 3

可实现两行效果

 <div style="float:left;text-align:right">
    Lorem ipsum dolor sit amet consectetur adipisicing elit. Error minus neque, exercitationem quas a, voluptate saepe illum enim necessitatibus id illo ut! Consectetur unde, quas optio quaerat sit corporis commodi.
  </div>