修改样式

This commit is contained in:
Anyon 2021-11-27 16:47:41 +08:00
parent ec81bd4be9
commit e5a96dfb3e
2 changed files with 88 additions and 4 deletions

View File

@ -2,15 +2,91 @@
<el-container>
<el-header>
<el-row justify="space-between">
<el-col :span="12">页面标题 导航条</el-col>
<el-col :span="12">页面标题 - 导航条</el-col>
<el-col :span="12" style="text-align:right">
<el-button>功能按钮</el-button>
<el-button>功能按钮</el-button>
<el-button>功能按钮1</el-button>
<el-button>功能按钮2</el-button>
</el-col>
</el-row>
</el-header>
<el-main>
{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构
<el-scrollbar>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
<div>{{ userName }}: 你好这里是为下一代 ThinkAdmin 后台管理系统预设计的 UI 结构</div>
</el-scrollbar>
</el-main>
</el-container>
</template>

View File

@ -220,13 +220,21 @@ body > .el-container {
background: #EFEFEF;
> .el-container {
height: 100%;
> .el-header {
background: white;
line-height: 60px;
}
> .el-main {
height: 1px;
padding: 0;
> .el-scrollbar {
padding: 20px;
box-sizing: border-box;
}
}
}
}