| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455 |
- <template>
- <el-container>
- <el-header>Header</el-header>
- <el-main>Main</el-main>
- <el-footer>Footer</el-footer>
- </el-container>
- </template>
- <script>
- export default {
- data(){
- },
- methods(){
- },
- mounted(){
- },
- }
- </script>
- <style scoped>
- .el-header, .el-footer {
- background-color: #B3C0D1;
- color: #333;
- text-align: center;
- line-height: 60px;
- }
-
- .el-aside {
- background-color: #D3DCE6;
- color: #333;
- text-align: center;
- line-height: 200px;
- }
-
- .el-main {
- background-color: #E9EEF3;
- color: #333;
- text-align: center;
- line-height: 160px;
- }
-
- body > .el-container {
- margin-bottom: 40px;
- }
-
- .el-container:nth-child(5) .el-aside,
- .el-container:nth-child(6) .el-aside {
- line-height: 260px;
- }
-
- .el-container:nth-child(7) .el-aside {
- line-height: 320px;
- }
- </style>
|