zoukankan      html  css  js  c++  java
  • bootstrap标签页

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <title>我是中国人</title>
    
            <!-- 新 Bootstrap 核心 CSS 文件 -->
            <link href="css/bootstrap.min.css" rel="stylesheet">
    
            <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
            <script src="js/bootstrap.min.js"></script>
    
            <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
        </head>
        <body>
            <div id="" class="container">
                <ul class="nav nav-pills">
                    <li>
                        <a href="">北京</a>
                    </li>
                    <li class="active">
                        <a href="">上海</a>
                    </li>
                    <li>
                        <a href="">广州</a>
                    </li>
                </ul>
            </div>
        </body>
    </html>

    image

    nav:基类

    nav-pills:胶囊式标签页

    nav-tabs:普通标签页

    nav-stacked:垂直排列

    active:默认显示的标签

  • 相关阅读:
    【应用】SVG饼状图
    【应用】图片翻转js
    userData IE
    cookie
    Local storage htm5
    全局ajax事件
    jQuery ajax序列化函数
    jQuery ajax中的get请求方法汇总
    $.ajax()
    nodejs安装错误
  • 原文地址:https://www.cnblogs.com/zhangxuechao/p/13822360.html
Copyright © 2011-2022 走看看