企业banner

liuqimichale
1 parent 7a5ccdcc
Showing 4 changed files with 31 additions and 2 deletions
webintroduce/src/assets/css/mixin.scss
webintroduce/src/assets/css/reset.css
webintroduce/src/assets/css/variables.scss
webintroduce/src/views/enterprise.vue
@@ -41,6 +41,14 @@
   box-shadow: $x $y $blur $color;
 }
+//居中
+@mixin pos-middle() {
+  position: absolute;
+  left: 50%;
+  top:50%;
+  transform: translate(-50%,-50%);
+}
+
@@ -138,6 +138,7 @@ table {
 }
+
 /*自定义导航选中样式*/
 .navActive{
   color: #f00;
-$baseColor:#000;
+$baseColor:#fff;
 $baseBgColor:rgba(247,248,250,1);
 <template>
     <div>
-      <div class="banner"></div>
+      <div class="banner pos-rel">
+        <div class="banner-des">
+          <p class="main-title">城市级智慧停车运营管理云平台</p>
+          <p class="sub-title">一城一网一平台 一车一位一编号</p>
+        </div>
+
+      </div>
     </div>
 </template>
@@ -17,4 +23,18 @@ export default {
   background: url("../assets/images/enterprise/banner.png") no-repeat;
   background-size: 100% 100%;
 }
+  .banner-des{
+    width: 1100px;
+    color: $baseColor;
+    @include pos-middle;
+    border-bottom: 1px solid #fff;
+  }
+  .main-title{
+    font-size: 77px;
+  }
+  .sub-title{
+    margin: 43px 0;
+    font-size: 42px;
+    color: rgba(255,255,255,.8);
+  }
 </style>