zoukankan      html  css  js  c++  java
  • Bootstrap系列 -- 7. 列表排版方式

    一. 去点列表

      1. 使用class=list-unstyled

    <ul >
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
        </ul>
    
        <ul class="list-unstyled">
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
    </ul>
    View Code

      有点列表和无点列表对比代码如上,效果图如下

     

    二. 排列一行列表

      使用 list-inline 样式

    <ul class="list-inline">
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
            <li>无序列表项目</li>
    </ul>
    View Code

    三. 混合使用

    <ul class="list-unstyled">
            <li>程序:
            </li>
            <li>
                <ul class="list-inline">
                    <li>C#</li>
                    <li>JS</li>
                    <li>java</li>
                </ul>
            </li>
    </ul>

  • 相关阅读:
    实验四 主存空间的分配和回收
    学期总结
    实验三 进程调度模拟程序
    团队项目
    博客参考评论
    dos系统
    学习进度条
    了解和熟悉操作系统
    问题的思考和回答
    Python-关于脚本和冒泡算法
  • 原文地址:https://www.cnblogs.com/qingyuan/p/4589135.html
Copyright © 2011-2022 走看看