bootstrap一、界面样式

发布时间：2020-12-17 20:38:10 所属栏目：安全来源：网络整理

导读：1：页头 div class ="page-header" !-- 组件替换 -- h3 当前用户:{{user==‘‘?"未登录":user}} / h3 / div 2：页体左-竖导航栏 ul class ="nav nav-pills nav-stacked" li role ="presentation" class ="active" a href ="#" 订单管理 / a / li li role ="p

1：页头

            <div class="page-header">
                <!-- 组件替换 -->
                <h3>当前用户:{{user==‘‘?"未登录":user}}</h3>
            </div>

2：页体左-竖导航栏

                <ul class="nav nav-pills nav-stacked">
                    <li role="presentation" class="active"><a href="#">订单管理</a></li>
                    <li role="presentation"><a href="#">个人订单</a></li>
                    <li role="presentation"><a href="#">个人中心</a></li>
                </ul>

3、页体右-栅栏格式，面板

            <div class="row">
                <div class="col-md-3">
                    <ul class="nav nav-pills nav-stacked">
                        <li role="presentation" class="active"><a href="#">订单管理</a></li>
                        <li role="presentation"><a href="#">个人订单</a></li>
                        <li role="presentation"><a href="#">个人中心</a></li>
                    </ul>
                </div>
                <div class="col-md-9">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            面板标题
                        </div>
                        <div class="panel-body">
                            面板内容
                        </div>
                    </div>
                </div>
            </div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!