zoukankan html css js c++ java

基本后台管理布局

页面html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>首页</title>
    <link href="/Content/site.css" rel="stylesheet"/>
    <link href="/Content/themes/base/layout.css" rel="stylesheet"/>
</head>
<body>
    
<div class="ui-layout-header ui-bb">

</div>
<div class="ui-layout-wrapper">
    <div class="ui-layout-slide">

    </div>
    <div class="ui-layout-content">

    </div>
</div>
<div class="ui-layout-footer">

</div>
</body>
</html>

CSS

* {
    height: 100%;
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari */
}

.ui-layout-header {
    height: 50px;
    margin-bottom: -50px;
    position: relative;
}

.ui-layout-wrapper {
    padding-top: 50px;
    min-height: 100%;
    height: 100% !important;
    height: 100%;
    background-color: ActiveBorder;
    padding-bottom: -30px;
}

    .ui-layout-wrapper .ui-layout-slide {
        width: 220px;
        min-height: 100%;
        float: left;
        margin-right: 100%;
        background-color: aqua;
    }

    .ui-layout-wrapper .ui-layout-content {
        width: 100%;
    }

        .ui-layout-wrapper .ui-layout-content .ui-layout-incontent {
            margin-left: 220px;
            background-color: red;
        }

.ui-layout-footer {
    margin-top: -30px;
    height: 30px;
    background-color: red;
    position: relative;
    z-index: 100;
}

查看全文

相关阅读:
python——集合
 python——字典
 python——用递归的方法求x的y次幂
 python——全局变量&局部变量
 python——组织列表
 Linux显示网络相关信息
 Linux里的发消息
 Linux中各种压缩文件
 Linux中的man
Linux的find命令

原文地址：https://www.cnblogs.com/zbspace/p/8372670.html