使用css实现文本两端对齐

原图效果：

效果图：

实现代如下：
HTML代码：

 <ul>
      <li>大道至简</li>
      <li>菩提</li>
      <li>只可意会</li>
      <li>不可言</li>
    </ul>

CSS样式：

ul{
    
    
  float: left;
}
ul li{
    
    
  width:80px;
  height:30px;
  list-style-type: none;
  background: orange;
  line-height: 30px;
  margin:5px 0;
  padding:0 10px;
  box-sizing: border-box;
  text-align-last: justify; // 实现属性
}