既然用了这个靠左对齐，就来谈一下
//正常靠左对齐方式，直接用text属性就好text-align:left//Flex布局靠左对齐//1.宽度不固定，最后一个元素左对齐(这样只能让最后一个元素左对齐，但凡在多一个元素就不行)ul li:last-child{margin-right:auto//2.使用伪元素//让父元素先display:flex,然后再使用justify-content: space-between//两端对齐中间平均分配，其他的几个属性我试着不行，例如around、evenly,//在伪元素中把flex属性设置为1，网上说的设置为auto或者1,auto我跑不通.text:after{content:'';flex:1}//3.html不能修改的情况下直接使用css中的grid布局.text{display:grid;justify-content: space-between;grid-template-columns:repeat(auto-fill,100px)}}
既然谈到了grid,正好说说他和flex的区别
布局不同：Flex布局是单一方向上的布局，只能水平布局或垂直布局，而grid是双向的，既能水平也能垂直元素的排列不同：flex是按着一定的顺序来进行排列的，grid可以指定排列顺序元素大小控制不同：flex中的元素大小是根据内容决定的，grid可以通过指定行和列的大小来决定
简单讲就是需求不同，用法也不同，flex布局虽然是单一的，但能进行响应式布局，grid是双向的，能实现复杂的网格布局
这里不推荐使用grid布局，因为grid支持高版本浏览器，其次在布局的时候不灵活，用他写写移动端就知道了，flex虽然是单一的，但是他的灵活性和兼容性好，不会出现奇奇古怪的问题，出现问题flex调试起来也方便
