main
parent
b233663bf9
commit
6e385b5e26
@ -0,0 +1,162 @@ |
|||||||
|
.topcontent{ |
||||||
|
width:100%; |
||||||
|
position: relative; |
||||||
|
margin-top:100px; |
||||||
|
} |
||||||
|
.topcontent img{ |
||||||
|
width:100%; |
||||||
|
|
||||||
|
} |
||||||
|
.titleContent{ |
||||||
|
position:absolute; |
||||||
|
top:30%; |
||||||
|
left:14%; |
||||||
|
} |
||||||
|
.titleContent .title{ |
||||||
|
font-size: 48px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #FFFFFF; |
||||||
|
text-shadow: 0px 2px 6px rgba(9,30,52,0.22); |
||||||
|
} |
||||||
|
.titleContent .subtitle{ |
||||||
|
font-size: 36px; |
||||||
|
font-family: Arial; |
||||||
|
font-weight: 400; |
||||||
|
color: #FFFFFF; |
||||||
|
} |
||||||
|
.leftcontent>img{ |
||||||
|
width:100%; |
||||||
|
} |
||||||
|
.details{ |
||||||
|
padding:20px 20px 40px 20px; |
||||||
|
background: #F8F8F8; |
||||||
|
} |
||||||
|
.contentContainer{ |
||||||
|
margin-top:70px; |
||||||
|
} |
||||||
|
.toptitle{ |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
} |
||||||
|
.details .toptitle h5{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
.toptitle span{ |
||||||
|
font-size: 14px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #999999; |
||||||
|
} |
||||||
|
.details .toptitle h5 span{ |
||||||
|
font-size: 16px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
color: #124AA0; |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
.details .toptitle h5 img{ |
||||||
|
width:20px; |
||||||
|
height:17px; |
||||||
|
margin-left:11px; |
||||||
|
} |
||||||
|
.details p{ |
||||||
|
padding:0; |
||||||
|
margin:0; |
||||||
|
font-size: 14px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #666666; |
||||||
|
margin-top:24px; |
||||||
|
} |
||||||
|
.more{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-top:55px; |
||||||
|
} |
||||||
|
.more span{ |
||||||
|
font-size: 16px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #124AA0; |
||||||
|
} |
||||||
|
.more img{ |
||||||
|
width:8px; |
||||||
|
height:14px; |
||||||
|
margin-left:11px; |
||||||
|
} |
||||||
|
|
||||||
|
.items{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
position: relative; |
||||||
|
background: #FFFFFF; |
||||||
|
border: 1px solid #EAEAEA; |
||||||
|
margin-bottom:6px; |
||||||
|
flex: 1; |
||||||
|
|
||||||
|
} |
||||||
|
.itemcontainer{ |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
justify-content: space-between; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
.itemcontainer>:last-child{ |
||||||
|
margin-bottom:0px; |
||||||
|
} |
||||||
|
.items .left{ |
||||||
|
width:190px; |
||||||
|
height:100%; |
||||||
|
} |
||||||
|
.items .left img{ |
||||||
|
width:100%; |
||||||
|
height:100%; |
||||||
|
} |
||||||
|
.items .right{ |
||||||
|
flex:1; |
||||||
|
margin-left:10px; |
||||||
|
padding:0 9px; |
||||||
|
} |
||||||
|
.right h5{ |
||||||
|
font-size: 16px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
color: #222222; |
||||||
|
font-weight: bold; |
||||||
|
} |
||||||
|
.right .time{ |
||||||
|
font-size: 14px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #999999; |
||||||
|
margin:16px 0; |
||||||
|
} |
||||||
|
.right p{ |
||||||
|
margin:0; |
||||||
|
padding:0; |
||||||
|
font-size: 14px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #999999; |
||||||
|
text-overflow: -o-ellipsis-lastline; |
||||||
|
overflow: hidden; |
||||||
|
text-overflow: ellipsis; |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-line-clamp: 3; |
||||||
|
line-clamp: 3; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
} |
||||||
|
.zhiding{ |
||||||
|
position:absolute; |
||||||
|
right:8px; |
||||||
|
top:10px; |
||||||
|
background: #F6F6F6; |
||||||
|
border-radius: 2px; |
||||||
|
|
||||||
|
font-size: 12px; |
||||||
|
font-family: Microsoft YaHei; |
||||||
|
font-weight: 400; |
||||||
|
color: #999999; |
||||||
|
padding:5px 10px; |
||||||
|
} |
After Width: | Height: | Size: 369 B |
After Width: | Height: | Size: 339 B |
@ -0,0 +1,6 @@ |
|||||||
|
$(function(){ |
||||||
|
$("#header").load("../public/header1.html",function(){ |
||||||
|
$('.header').addClass('on') |
||||||
|
}); |
||||||
|
// $("#footer").load("../public/footer.html");
|
||||||
|
}); |
Loading…
Reference in new issue