将ul无序列表元素中的列表项li元素的display属性设置成inline或inline-block，个人比较常用的是后者：
ul li{display:inline-block;}
水平居中方法：只要将ul元素包含于一个div元素，并将div元素的text-align属性设置为center即可将ul水平居中。除此之外，由于ul的列表默认情形下是有左内边距的，以是，为了能够让列表能够更好地水平居中，须要将ul的左内边距padding-left设置为0，详细可见下方的综合实例。
垂直居中方法：为包含ul元素的div元素设置宽度width和高度height（实际上导航条一样平常也须要有宽度和高度的设置），然后将ul的line-height属性设置为父元素的高度height即可。
去掉圆点的方法将ul元素的list-style属性设置为none即可。
HTML ul li 横排居中排列的方法，三步骤及实例
ul li 横排居中排列综合实例代码，及在线编辑器<div class='e1'> <ul class='e2'> <li>HTML</li> <li>python</li> <li>golang</li> </ul></div><style> .e1{width:100%;height:50px;border:1px solid skyblue;text-align:center;} .e2{list-style:none;padding-left:0%;} .e2 li{line-height:50px;display:inline-block;}</style>HTML+CSS+JS实例在线编辑器：
HTML ul li 横排居中排列的方法，综合实例在线 - HTML教程
实例代码解析如上代码，一定要将ul的左内边距padding-left设置为0，否则ul列表的“水平居中”将倾向右边，大家可以将.e2中的padding-left删除掉，然后再在线运行看一看效果。
python全栈：笨鸟工具-璞玉天成，大器晚成
