菜单和左侧对齐
Showing
2 changed files
with
11 additions
and
8 deletions
| ... | @@ -103,7 +103,7 @@ ol, ul { list-style:none; } | ... | @@ -103,7 +103,7 @@ ol, ul { list-style:none; } |
| 103 | >.is-top{ | 103 | >.is-top{ |
| 104 | position: -webkit-fixed; | 104 | position: -webkit-fixed; |
| 105 | position: fixed; | 105 | position: fixed; |
| 106 | top: 60px; | 106 | top: 72px; |
| 107 | z-index: 999; | 107 | z-index: 999; |
| 108 | width: 100%; | 108 | width: 100%; |
| 109 | margin-bottom: 0; | 109 | margin-bottom: 0; | ... | ... |
| ... | @@ -26,6 +26,7 @@ | ... | @@ -26,6 +26,7 @@ |
| 26 | v-for="(item, index) in headTop" | 26 | v-for="(item, index) in headTop" |
| 27 | :key="index + '1'" | 27 | :key="index + '1'" |
| 28 | :class="{ 'is-active': item.select }" | 28 | :class="{ 'is-active': item.select }" |
| 29 | :style="{'height':item.name == '首页' && item.select ? '70'+'px' : '71'+'px'}" | ||
| 29 | @click="selectTopItems(index)" | 30 | @click="selectTopItems(index)" |
| 30 | > | 31 | > |
| 31 | <i :class="item.icon"></i> | 32 | <i :class="item.icon"></i> |
| ... | @@ -335,6 +336,7 @@ export default { | ... | @@ -335,6 +336,7 @@ export default { |
| 335 | } | 336 | } |
| 336 | }, | 337 | }, |
| 337 | selectTopItems(ind) { | 338 | selectTopItems(ind) { |
| 339 | console.log(this.headTop); | ||
| 338 | if (ind == 1) { | 340 | if (ind == 1) { |
| 339 | //点击新建,弹框 | 341 | //点击新建,弹框 |
| 340 | this.dialogVisible = true; | 342 | this.dialogVisible = true; |
| ... | @@ -430,19 +432,22 @@ export default { | ... | @@ -430,19 +432,22 @@ export default { |
| 430 | .el-header { | 432 | .el-header { |
| 431 | background-color: #fff; | 433 | background-color: #fff; |
| 432 | padding: 0 !important; | 434 | padding: 0 !important; |
| 435 | height: 72px!important; | ||
| 433 | .header-top { | 436 | .header-top { |
| 434 | height: 60px; | 437 | height: 72px; |
| 435 | border-bottom: 1px solid#EAEAEA; | 438 | border-bottom: 1px solid#EAEAEA; |
| 436 | box-sizing: border-box; | 439 | box-sizing: border-box; |
| 437 | .top-items { | 440 | .top-items { |
| 438 | cursor: pointer; | 441 | cursor: pointer; |
| 439 | height: 60px; | 442 | height: 72px; |
| 440 | padding: 0 30px; | 443 | padding: 0 30px; |
| 441 | font-size: 18px; | 444 | font-size: 18px; |
| 442 | line-height: 60px; | 445 | line-height: 72px; |
| 443 | float: left; | 446 | float: left; |
| 444 | position: relative; | 447 | position: relative; |
| 445 | color: #4a4a4a; | 448 | color: #4a4a4a; |
| 449 | // border-left: 1px solid #EAEAEA; | ||
| 450 | border-right: 1px solid #EAEAEA; | ||
| 446 | i { | 451 | i { |
| 447 | margin-right: 6px; | 452 | margin-right: 6px; |
| 448 | font-size: 18px; | 453 | font-size: 18px; |
| ... | @@ -451,15 +456,13 @@ export default { | ... | @@ -451,15 +456,13 @@ export default { |
| 451 | } | 456 | } |
| 452 | .hamburger { | 457 | .hamburger { |
| 453 | font-size: 16px; | 458 | font-size: 16px; |
| 454 | line-height: 60px; | 459 | line-height: 72px; |
| 455 | color: #000; | 460 | color: #000; |
| 456 | } | 461 | } |
| 457 | } | 462 | } |
| 458 | .top-items.is-active { | 463 | .top-items.is-active { |
| 459 | color: #006cff; | 464 | color: #006cff; |
| 460 | border-left: 1px solid #EAEAEA; | 465 | height: 71px; |
| 461 | border-right: 1px solid #EAEAEA; | ||
| 462 | height: 58px; | ||
| 463 | border-bottom: 1px solid #FFF; | 466 | border-bottom: 1px solid #FFF; |
| 464 | } | 467 | } |
| 465 | } | 468 | } | ... | ... |
-
Please register or sign in to post a comment