<template> <el-container> <el-aside class="left-block" width="140px"> <div class="list-title"> 页面列表 </div> <div class="page-list"> <div class="box"> </div> <div class="title">未命名页面</div> </div> <div class="page-list-add"> <img :src="addUrl"/> <div class="title">添加新页面</div> </div> </el-aside> <el-main> <editor/> </el-main> </el-container> </template> <script> import addUrl from '../../assets/editor/Group 7.png' import editor from './editor' export default { components:{ editor }, data(){ return{ addUrl:addUrl } } } </script> <style scoped lang="less"> .el-container{ height: 100%; .el-main{ padding: 10px; background: #f5f8ff; } .left-block{ box-shadow: 1px 0 2px 0 #CCCCCC; font-size: 14px; color: #333333; text-align: center; .list-title{ padding: 5px; } .page-list{ padding: 10px 0; .box{ height: 63px; margin: auto; width: 112px; border: 1px solid #666666; border-radius: 9px; } .title{ font-size: 12px; text-align: center; } &-add{ cursor: pointer; padding: 10px 0; font-size: 12px; color: #CCCCCC; } } } } </style>