|
@@ -1,28 +1,179 @@
|
|
<template>
|
|
<template>
|
|
<div id="app">
|
|
<div id="app">
|
|
- <img alt="Vue logo" src="./assets/logo.png">
|
|
|
|
- <HelloWorld msg="Welcome to Your Vue.js App"/>
|
|
|
|
|
|
+ <div class="Top_warp">
|
|
|
|
+ <div class="imp_top_img">
|
|
|
|
+ <img
|
|
|
|
+ class="image_top"
|
|
|
|
+ src="@/assets/common_banner2.c4347a45.jpg"
|
|
|
|
+ alt=""
|
|
|
|
+ />
|
|
|
|
+ <div class="font_warp">
|
|
|
|
+ <div class="font_center">
|
|
|
|
+ <div class="font_center_imp">
|
|
|
|
+ <div class="picture">
|
|
|
|
+ <img class="image_top" src="@/assets/download.png" alt="" />
|
|
|
|
+ </div>
|
|
|
|
+ <div>
|
|
|
|
+ <p
|
|
|
|
+ style="
|
|
|
|
+ line-height: 93px;
|
|
|
|
+ font-size: 20px;
|
|
|
|
+ font-weight: 700;
|
|
|
|
+ margin-left: 14px;
|
|
|
|
+ color: white;
|
|
|
|
+ "
|
|
|
|
+ >
|
|
|
|
+ 贵州省人才人事公共服务平台
|
|
|
|
+ </p>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="font_warp_item" style="margin-left: 32px">
|
|
|
|
+ <p
|
|
|
|
+ class="font_warp_item_font"
|
|
|
|
+ style="border-bottom: 3px solid white"
|
|
|
|
+ >
|
|
|
|
+ 首页
|
|
|
|
+ </p>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="font_warp_item">
|
|
|
|
+ <p class="font_warp_item_font">公式公告</p>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="HumanHead">
|
|
|
|
+ <img
|
|
|
|
+ class="HumanHead_pic"
|
|
|
|
+ src="@/assets/download2.png"
|
|
|
|
+ alt=""
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="imp_top_bottom">
|
|
|
|
+ <div class="bottom_warp">
|
|
|
|
+ <span
|
|
|
|
+ class="el-icon-location"
|
|
|
|
+ style="font-size: 18px; color: #626262"
|
|
|
|
+ ></span>
|
|
|
|
+ <span style="font-size: 14px; line-height: 49px; color: #626262"
|
|
|
|
+ >当前所在位置:</span
|
|
|
|
+ >
|
|
|
|
+ <span style="font-size: 14px; line-height: 49px; color: #626262"
|
|
|
|
+ >首页</span
|
|
|
|
+ >
|
|
|
|
+ <i
|
|
|
|
+ class="el-icon-arrow-right"
|
|
|
|
+ style="color: #c0c4cc; font-size: 14px; padding: 6px"
|
|
|
|
+ >
|
|
|
|
+ </i>
|
|
|
|
+ <span style="font-size: 14px; line-height: 49px; color: #49a1f9"
|
|
|
|
+ >职称证书查询</span
|
|
|
|
+ >
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <CenterNav />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-import HelloWorld from './components/HelloWorld.vue'
|
|
|
|
-
|
|
|
|
|
|
+import CenterNav from "./components/CenterNav.vue";
|
|
export default {
|
|
export default {
|
|
- name: 'App',
|
|
|
|
- components: {
|
|
|
|
- HelloWorld
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
|
|
+ name: "App",
|
|
|
|
+ components: { CenterNav },
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
|
|
|
+<style lang="less">
|
|
|
|
+// 隐藏滚动条
|
|
|
|
+::-webkit-scrollbar {
|
|
|
|
+ width: 0 !important;
|
|
|
|
+}
|
|
|
|
+::-webkit-scrollbar {
|
|
|
|
+ width: 0 !important;
|
|
|
|
+ height: 0;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+* {
|
|
|
|
+ margin: 0;
|
|
|
|
+ padding: 0;
|
|
|
|
+}
|
|
|
|
+ul {
|
|
|
|
+ list-style: none;
|
|
|
|
+}
|
|
#app {
|
|
#app {
|
|
- font-family: Avenir, Helvetica, Arial, sans-serif;
|
|
|
|
- -webkit-font-smoothing: antialiased;
|
|
|
|
- -moz-osx-font-smoothing: grayscale;
|
|
|
|
- text-align: center;
|
|
|
|
- color: #2c3e50;
|
|
|
|
- margin-top: 60px;
|
|
|
|
|
|
+ min-width: 516px;
|
|
|
|
+ top: 0;
|
|
|
|
+ left: 0;
|
|
|
|
+ right: 0;
|
|
|
|
+ bottom: 0;
|
|
|
|
+ .Top_warp {
|
|
|
|
+ .imp_top_img {
|
|
|
|
+ position: relative;
|
|
|
|
+ width: 100%;
|
|
|
|
+ .image_top {
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
|
|
+ .font_warp {
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 0;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 96px;
|
|
|
|
+ // background-color: red;
|
|
|
|
+ border-bottom: 1px solid #dad8d8;
|
|
|
|
+ .font_center {
|
|
|
|
+ position: absolute;
|
|
|
|
+ left: 0;
|
|
|
|
+ right: 0;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ width: 1182px;
|
|
|
|
+ height: 100px;
|
|
|
|
+ // background-color: rgb(38, 182, 38);
|
|
|
|
+ .font_center_imp {
|
|
|
|
+ display: flex;
|
|
|
|
+ .picture {
|
|
|
|
+ width: 37px;
|
|
|
|
+ line-height: 120px;
|
|
|
|
+ }
|
|
|
|
+ .font_warp_item {
|
|
|
|
+ line-height: 93px;
|
|
|
|
+ .font_warp_item_font {
|
|
|
|
+ padding: 0 15px;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: white;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .HumanHead {
|
|
|
|
+ .HumanHead_pic {
|
|
|
|
+ width: 60px;
|
|
|
|
+ height: 60px;
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+ margin-left: 620px;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .imp_top_bottom {
|
|
|
|
+ position: relative;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 49px;
|
|
|
|
+ background-color: #f2f2f2;
|
|
|
|
+ margin-top: -2px;
|
|
|
|
+ .bottom_warp {
|
|
|
|
+ position: absolute;
|
|
|
|
+ width: 1182px;
|
|
|
|
+ height: 100%;
|
|
|
|
+ left: 0;
|
|
|
|
+ right: 0;
|
|
|
|
+ margin: 0 auto;
|
|
|
|
+ // background-color: red;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|