1、在HBuilderX工具已创建的Web项目,鼠标右键新建html,输入文件名称为float.html

2、打开float.html文件,向body标签中插入一个无序列表

3、在无序列表元素ul外层的div标签添加一个class属性,设置文字居中、元素居中

4、保存代码并运行项目,打开浏览器查看效果,发现无序列表的点和子项分离了

5、利用class和元素组合的选择器,设置无序列表float为left,然后left设置为50%

6、再次保存代码并刷新浏览器,可以看到无序列表的点去掉了,纵向排列变为横向排列,并且是居中显示
