| | |
| | | <div class="common-header"> |
| | | <div class="header"> |
| | | <div class="logo"> |
| | | <div>{{ title }}</div> |
| | | <div class="title">{{ title }}</div> |
| | | <div class="list"> |
| | | <div class="item">服务中心</div> |
| | | <div class="item active"> |
| | | <div>服务中心</div> |
| | | <div class="linellae"></div> |
| | | </div> |
| | | <div class="item">安防中心</div> |
| | | <div class="item">消防中心</div> |
| | | <div class="item">能管中心</div> |
| | |
| | | .common-header { |
| | | background-color: #2080f7; |
| | | } |
| | | .list{ |
| | | flex: 1; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-left: 60px; |
| | | .item{ |
| | | margin-right: 40px; |
| | | font-size: 16px; |
| | | font-weight: 400; |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | justify-content: flex-start; |
| | | height: 40px; |
| | | cursor: pointer; |
| | | .linellae{ |
| | | width: 64px; |
| | | height: 2px; |
| | | background: #FFFFFF; |
| | | } |
| | | } |
| | | .active{ |
| | | font-weight: 500; |
| | | } |
| | | } |
| | | .header { |
| | | overflow: hidden; |
| | | // background: #fff; |
| | |
| | | .logo { |
| | | /* background: url("../../assets/images/top_ic_chilun@2x.png") no-repeat; */ |
| | | box-sizing: border-box; |
| | | min-width: 280px; |
| | | min-width: 360px; |
| | | height: 56px; |
| | | padding: 10px 30px; |
| | | // flex-shrink: 0; |
| | |
| | | color: #fff; |
| | | display: flex; |
| | | align-items: center; |
| | | .title{ |
| | | width: 200px; |
| | | } |
| | | // display: inline; |
| | | .title-en { |
| | | font-size: 11px; |
| | |
| | | } |
| | | } |
| | | .user { |
| | | width: 712px; |
| | | width: 212px; |
| | | box-sizing: border-box; |
| | | height: 56px; |
| | | padding-right: 25px; |