本文重点记载“css流” 的概念。
1.在css2.1时代，css属性的定位都是基于人类认知的方向的，既上下左右，而不是基于“流”。这样的设计其实是和css底层设计冲突的。
举个例子:有两个按钮
<div>
<button>第一按钮</button>
<button>第二按钮</button>
</div>
---
button{
margin-right:10px;
}
2.这段代码的意思显而易见，给按钮加一个右边距，显得不那么拥挤。
3.绝大部分情况下，这么使用是没有问题的，但是如果开发者是阿拉伯那边的，他们可能会希望从右到左排列，这时候mr-10px 就会有问题：
div {
bg-[pink];
direction:rtl;
}
需要把mr-10px 修改成ml-10px
4.但是，如果我们一开始设置的不是符合现实世界认知的margin-right属性。而是符合css世界“流”概念的逻辑属性
button {
margin-inline-end:10px;
}
5.它表示内联元素文档流结束的方向。
这样，无论是从左到右，还是从右到左，都不会产生任何问题。
这就是“流淌”在文档流中的css逻辑属性。
6.绝大部分情况下，我们不会去使用direction，writing-mode,text-orientation等属性。
而且margin-inline-end 这个属性在部分老式浏览器中兼容性很差，所以这个属性其实没有必要去使用。
正常情况下还是mr-10px ml-10px 是最适合也是最好用的属性。
