Parcourir la source

二级页面头部显示

guhongwei il y a 5 ans
Parent
commit
141ffa1715
2 fichiers modifiés avec 20 ajouts et 2 suppressions
  1. 1 0
      src/layout/detail-layout.vue
  2. 19 2
      src/layout/layout-part/top-Deatil.vue

+ 1 - 0
src/layout/detail-layout.vue

@@ -72,6 +72,7 @@ export default {
   float: left;
   width: 100%;
   height: 120px;
+  line-height: 120px;
   background: #fff;
   padding: 10px 0;
 }

+ 19 - 2
src/layout/layout-part/top-Deatil.vue

@@ -1,7 +1,14 @@
 <template>
   <div id="top-Deatil">
     <el-row>
-      <el-image style="width: 600px; height: 100px" :src="site.banner || ''"></el-image>
+      <el-col :span="2"> <el-image style="width: 100px; height: 100px" :src="site.logo || ''"></el-image></el-col>
+      <el-col :span="22">
+        <el-col :span="22" class="topTit">
+          <el-link :underline="false">
+            {{ site.name }}
+          </el-link>
+        </el-col>
+      </el-col>
     </el-row>
   </div>
 </template>
@@ -33,4 +40,14 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="less" scoped>
+.topTit .el-link.el-link--default {
+  height: 100px;
+  line-height: 100px;
+  padding: 0 10px;
+  font-size: 3em;
+  font-family: cursive;
+  color: #850000;
+  text-shadow: 2px 2px 0 #fff;
+}
+</style>