如何使用CSS3中的属性设置无序列表成水平菜单

时间:2024-10-13 21:02:47

1、第一步,双击打开HBuilder工具,新建页面文件;然后在body标签中,插入一个无序列表

如何使用CSS3中的属性设置无序列表成水平菜单
如何使用CSS3中的属性设置无序列表成水平菜单

2、第二步,添加一个style标签,利用元素选择器,设置margin和padding属性

如何使用CSS3中的属性设置无序列表成水平菜单

3、第三步,再次利用li标签元素选择器,设置宽度、内边距、背景色、边框、文字居中和居左

如何使用CSS3中的属性设置无序列表成水平菜单

4、第四步,使用a超链接,定义字体颜色、字体属性和设置无下划线

如何使用CSS3中的属性设置无序列表成水平菜单

5、第五步,保存代码并运行页面文件,打开浏览器,查看界面效果

如何使用CSS3中的属性设置无序列表成水平菜单

6、第六步,在li标签中,添加属性display,设置为inline-block

如何使用CSS3中的属性设置无序列表成水平菜单
© 手抄报圈