HTML的li标签默认为竖向显示 。 下面 , 我们来看看html中怎样让多个li标签横排显示吧 。 操作方式 01 HTML页面
利用Visual Studio软件新建出一个HTML页面 , 如下图所示:
文章插图
02 li代码
在body标签内输入li标签的相关代码 , 如下所示:
<ul>
<li>模块一</li>
<li>模块二</li>
<li>模块三</li>
<li>模块四</li>
<li>模块五</li>
<li>模块六</li>
<ul>
文章插图
03 浏览器中显示
代码在浏览器中显示的成果图可以看到li标签为竖标的目的显示 , 如下图所示:
文章插图
04 横排显示
让li标签横排显示的代码如下所示:
#nav ul li
{
float:left;
list-style:none;
}
文章插图
05 【html中怎样让多个li标签横排显示】结果图
li标签横标的目的显示的结果图如下图所示:
文章插图
以上内容就是html中怎样让多个li标签横排显示的内容啦 , 希望对你有所帮助哦!
推荐阅读
- 电脑视频怎样导入手机里
- 斗篷衣应该怎样搭配,斗篷衣搭配技巧
- 怎样自己吹卷发
- 和平精英中秋月兔模式兔子窝在哪 怎么找礼物
- 逆战幻紫怎么获得
- lol云顶之弈开局怎么卡圈中心
- 怎样用手机拍摄星空
- 如何快速提取图片中的文字
- 柴犬发抖是什么原因 怎样帮助柴犬缓解发抖现象
- 2018年1月新番中七大热门动漫推荐