<video id="h99qi"><ins id="h99qi"><span id="h99qi"></span></ins></video>

        <var id="h99qi"><td id="h99qi"></td></var>
        1. <acronym id="h99qi"></acronym>
          <wbr id="h99qi"><code id="h99qi"><span id="h99qi"></span></code></wbr>

          1. <var id="h99qi"><th id="h99qi"></th></var>
            0712-2888027 189-8648-0214
            微信公眾號

            孝感風信網絡科技有限公司微信公眾號

            當前位置:主頁 > 技術支持 > HTML5/CSS3 > bootstrap柵格系統顯示5列的方法

            bootstrap柵格系統顯示5列的方法

            時間:2024-05-19來源:風信官網 點擊: 1646次
            在 head  里加載 bootstrap 的 css 之后

            <!-- 新 Bootstrap 核心 CSS 文件 -->
            <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">

            <!-- 可選的Bootstrap主題文件(一般不用引入) -->
            <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

            <!-- jQuery文件。務必在bootstrap.min.js 之前引入 -->
            <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>

            <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
            <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

            自己再添加幾個 css class

            <style>
            .col-lg-2dot4 {
            position: relative;
            min-height: 1px;
            padding-right: 15px;
            padding-left: 15px;
            }
            @media (min-width: 1200px) {
            .col-lg-2dot4 {
            float: left;
            }
            .col-lg-2dot4 {
            width: 20%;
            }
            .col-lg-pull-2dot4 {
            right: 20%;
            }
            .col-lg-push-2dot4 {
            left: 20%;
            }
            .col-lg-offset-2dot4 {
            margin-left: 20%;
            }
            }
            </style>

            后需要顯示 5 列的地方應用這個 class 即可

            <div class="col-lg-2dot4"></div>
            <div class="col-lg-2dot4"></div>
            <div class="col-lg-2dot4"></div>
            <div class="col-lg-2dot4"></div>
            <div class="col-lg-2dot4"></div>
            熱門關鍵詞: bootstrap 柵格系統 顯示5列
            欄目列表
            推薦內容
            熱點內容
            展開
            亚洲精品在线视频_18禁无码毛片精品久久久久久_精品熟妇无码av免费久久_午夜福利片