ul li 横排有很多方法，可以使用float， 这里使用的flex方式。
具体查看代码和运行效果图
<!DOCTYPE html><html><head><meta charset="utf-8"><title>ul li 横排居中</title><style type="text/css">ul {display: flex;/*flex-direction: row;*//*flex-wrap: nowrap;*/flex-flow: row nowrap;justify-content: center;}ul li {list-style: none;border: 2px solid #161EE8FF;text-align: center;line-height: 30px;padding: 10px;height: 30px;width: 100px;margin: 0 10px;}</style></head><body><ul><li>列表1</li><li>列表2</li><li>列表3</li><li>列表4</li><li>列表5</li></ul></body></html>
运行结果：
