Skip to content

Z
zh_zcb-ems
Commit 00b37b54 authored by chen.yiwen's avatar chen.yiwen
Browse files
Options

顶部栏样式

parent 407e3580
Show whitespace changes
Inline Side-by-side
Showing with 228 additions and 0 deletions
css/index.css
View file @ 00b37b54
body {
margin: 0 20px;
padding: 0;
background: url("../images/bg.png") no-repeat;
}
ul {
list-style: none;
}
.header {
position: relative;
height: 130px;
width: 100%;
background: url("../images/header-bg.png") no-repeat;
background-size: cover;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.header-left {
width: 310px;
}
.logo {
width: 228px;
height: 40px;
margin: 80px 0 0 20px;
background: url("../images/logo.png") no-repeat;
background-size: cover;
}
.header-middle {
color: white;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.header-middle ul {
display: inline-block;
margin: 85px 0 0;
}
.header-middle ul li {
display: inline-block;
width: 90px;
cursor: pointer;
}
.header-middle ul li span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #4380f0;
padding-bottom: 5px;
}
.header-middle ul li.active > span,
.header-middle ul li:hover > span {
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #01fff6;
border-bottom: 3px solid #01fff6;
}
.header-middle > div {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
text-align: center;
font-size: 36px;
font-family: Source Han Sans CN;
font-weight: bold;
color: linear-gradient(0deg, rgba(7, 58, 152, 0.5) 0%, #ffffff 100%);
text-shadow: 0px 5px 0px rgba(7, 58, 152, 0.5);
line-height: 130px;
}
.header-right {
width: 310px;
margin-right: 20px;
text-align: right;
}
.header-right > div {
position: relative;
margin: 68px 0 0;
font-size: 16px;
line-height: 23px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #01fff6;
}
.header-right > div > span:first-child {
display: inline-block;
width: 23px;
height: 23px;
background: url("../images/user.png") no-repeat;
background-size: cover;
margin-right: 15px;
}
.header-right > div > span:nth-child(2) {
display: inline-block;
width: 60px;
height: 23px;
text-align: left;
vertical-align: top;
margin-top: -3px;
}
.header-right > div > span:last-child {
display: inline-block;
width: 21px;
height: 23px;
cursor: pointer;
background: url("../images/logout.png") no-repeat;
background-size: contain;
margin-right: 15px;
}
/*# sourceMappingURL=index.css.map */
\ No newline at end of file
css/index.css.map 0 → 100644
View file @ 00b37b54
{"version":3,"file":"index.css","sources":["index.less"],"names":[],"mappings":"AAAA;EACE,cAAA;EACA,UAAA;EACA,gBAAgB,6BAAhB;;AAEF;EACE,gBAAA;;AAEF;EACE,kBAAA;EACA,aAAA;EACA,WAAA;EACA,gBAAgB,oCAAhB;EACA,sBAAA;EACA,aAAA;;AAEF;EACE,YAAA;;AAEF;EACE,YAAA;EACA,YAAA;EACA,qBAAA;EACA,gBAAgB,+BAAhB;EACA,sBAAA;;AAEF;EACE,YAAA;EACA,OAAA;EACA,aAAA;;AAHF,cAIE;EACE,qBAAA;EACA,gBAAA;;AANJ,cAIE,GAGE;EACE,qBAAA;EACA,WAAA;EACA,eAAA;;AAVN,cAIE,GAGE,GAIE;EACE,qBAAA;EACA,eAAA;EACA,+BAAA;EACA,gBAAA;EACA,cAAA;EACA,mBAAA;;AAEF,cAfJ,GAGE,GAYG,OAAQ;AACT,cAhBJ,GAGE,GAaG,MAAO;EACN,eAAA;EACA,+BAAA;EACA,gBAAA;EACA,cAAA;EACA,gCAAA;;AAIN,cAAE;EACA,OAAA;EACA,kBAAA;EACA,eAAA;EACA,+BAAA;EACA,iBAAA;EACA,OAAO,6DAAP;EACA,8CAAA;EACA,kBAAA;;AAGJ;EACE,YAAA;EACA,kBAAA;EACA,iBAAA;;AACA,aAAE;EACA,kBAAA;EACA,gBAAA;EACA,eAAA;EACA,iBAAA;EACA,+BAAA;EACA,gBAAA;EACA,cAAA;;AACA,aARA,MAQE,OAAM;EACN,qBAAA;EACA,WAAA;EACA,YAAA;EACA,gBAAgB,+BAAhB;EACA,sBAAA;EACA,kBAAA;;AAEF,aAhBA,MAgBE,OAAM,UAAU;EAChB,qBAAA;EACA,WAAA;EACA,YAAA;EACA,gBAAA;EACA,mBAAA;EACA,gBAAA;;AAEF,aAxBA,MAwBE,OAAM;EACN,qBAAA;EACA,WAAA;EACA,YAAA;EACA,eAAA;EACA,gBAAgB,iCAAhB;EACA,wBAAA;EACA,kBAAA","sourceRoot":""}
\ No newline at end of file
css/index.less 0 → 100644
View file @ 00b37b54
body {
margin: 0 20px;
padding: 0;
background: url("../images/bg.png") no-repeat;
}
ul {
list-style: none;
}
.header {
position: relative;
height: 130px;
width: 100%;
background: url("../images/header-bg.png") no-repeat;
background-size: cover;
display: flex;
}
.header-left {
width: 310px;
}
.logo {
width: 228px;
height: 40px;
margin: 80px 0 0 20px;
background: url("../images/logo.png") no-repeat;
background-size: cover;
}
.header-middle {
color: white;
flex: 1;
display: flex;
ul {
display: inline-block;
margin: 85px 0 0;
li {
display: inline-block;
width: 90px;
cursor: pointer;
span {
display: inline-block;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #4380f0;
padding-bottom: 5px;
}
&.active > span,
&:hover > span {
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #01fff6;
border-bottom: 3px solid #01fff6;
}
}
}
& > div {
flex: 1;
text-align: center;
font-size: 36px;
font-family: Source Han Sans CN;
font-weight: bold;
color: linear-gradient(0deg, rgba(7, 58, 152, 0.5) 0%, #ffffff 100%);
text-shadow: 0px 5px 0px rgba(7, 58, 152, 0.5);
line-height: 130px;
}
}
.header-right {
width: 310px;
margin-right: 20px;
text-align: right;
& > div {
position: relative;
margin: 68px 0 0;
font-size: 16px;
line-height: 23px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #01fff6;
& > span:first-child {
display: inline-block;
width: 23px;
height: 23px;
background: url("../images/user.png") no-repeat;
background-size: cover;
margin-right: 15px;
}
& > span:nth-child(2) {
display: inline-block;
width: 60px;
height: 23px;
text-align: left;
vertical-align: top;
margin-top: -3px;
}
& > span:last-child {
display: inline-block;
width: 21px;
height: 23px;
cursor: pointer;
background: url("../images/logout.png") no-repeat;
background-size: contain;
margin-right: 15px;
}
}
}
.stat-bar {
}
.content {
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment