project-neic/src/components/TitleBar.vue

/* 标题栏 */
<template>
  <div class="title-bar">
    <el-row>
      <el-col :span=3>
        <img class="logo" src="../assets/img/main_window/logo.png" sytle="align-items"/>
      </el-col>
      <el-col :span=1></el-col>
      <el-col :span=3>
          <div class="titleinfo">
              <ul>
                  <li><TitleBarCard title='装机容量' unit="MW" value=20></TitleBarCard></li>
              </ul>
          </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import TitleBarCard from './area/mainwindow/TitleBarCard.vue'
export default{
    name:"TitleBar",
    components:{
        TitleBarCard,
    }
}
</script>


<style scoped>
.title-bar {
  height: 6vh;
  background-color: #FF0000;
  margin-top: 0;
  margin-right: 0;
  margin-left: 0;
}
.logo{
    position: relative;
    top:30%;
}
.titleinfo{
    background-color: #141414;
    height: auto;
    padding:13px;
    border-radius: 6px;
    margin-top: 5px;
    margin-bottom: 5px;
}

ul li{
    display: inline;
}
</style>