html中怎样让多个li标签横排显示

li标签默认的是竖排显示,那么怎样让li标签横排显示呢

工具/原料

  • 一台电脑
  • Dreamweaver编辑器

方法/步骤

  1. 1

    利用Dreamweaver新建一个html页面

    html中怎样让多个li标签横排显示
  2. 2

    在body里面输入代码

    <ul>

     <li>你好</li>

    <li>小鱼</li>

    <li>小小</li>

    </ul>

    html中怎样让多个li标签横排显示
  3. 3

    默认的样式是这样的

    html中怎样让多个li标签横排显示
  4. 4

    编辑li标签的css样式

    html中怎样让多个li标签横排显示
  5. 5

    float:left代表的是元素左对齐。这样li标签就可以横排显示了,list-style:none用来去除li标签前面的小圆点。最终浏览器里面的效果如下图所示

    html中怎样让多个li标签横排显示
    END

posted on 2016-04-03 09:45  大雨落幽燕  阅读(2156)  评论(0编辑  收藏  举报

导航