first commit
This commit is contained in:
zufeng555
480
public/static/style.css
Normal file
480
public/static/style.css
Normal file
@@ -0,0 +1,480 @@
|
||||
/*index首页*/
|
||||
.index .header .banner{
|
||||
background-image:url('../img/bannerbg1920.jpg');
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.index .header .banner .bannertop{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
}
|
||||
.index .header .banner .bannertop .left ul{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: flex-end; /*左对齐*/
|
||||
align-items: center;
|
||||
}
|
||||
.index .header .banner .bannertop .left ul li{
|
||||
flex:1;
|
||||
color:#fff;
|
||||
font-size: 0.13rem;
|
||||
text-align: center;
|
||||
padding:0.10rem;
|
||||
}
|
||||
.index .header .banner .bannertop .left ul li:hover{
|
||||
padding:0.10rem;
|
||||
border-radius: 50px;
|
||||
background: #0478a1;
|
||||
}
|
||||
|
||||
|
||||
.index .header .banner .bannertop .right>div{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
width: 100%;
|
||||
justify-content: flex-end;
|
||||
/*align-items: center;*/
|
||||
}
|
||||
.index .header .banner .bannertop .right div a{
|
||||
font-size: 0.16rem;
|
||||
color:#fff!important;
|
||||
text-align: center;
|
||||
display: block;
|
||||
padding:0.15rem;
|
||||
}
|
||||
.index .header .banner .bannertop .right div a:first-child{
|
||||
background: #0478a1;
|
||||
border-top-left-radius:0.5rem;
|
||||
border-bottom-left-radius:0.5rem;
|
||||
}
|
||||
.index .header .banner .bannertop .right div a:nth-child(2){
|
||||
background: #eb9a24;
|
||||
border-top-right-radius:0.5rem;
|
||||
border-bottom-right-radius:0.5rem;
|
||||
}
|
||||
|
||||
.index .header .banner .bannersearch>div{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
}
|
||||
|
||||
.index .header .banner .bannersearch input{
|
||||
border-radius:5px;
|
||||
padding-left:0.2rem;
|
||||
font-size:0.22rem;
|
||||
color: #666;
|
||||
border:1px solid #d3d3d3;
|
||||
}
|
||||
.index .header .banner .bannersearch button{
|
||||
outline: none;
|
||||
border:none;
|
||||
height: 0.63rem;
|
||||
width: 0.62rem;
|
||||
position: absolute;
|
||||
top:0.01rem;
|
||||
right:0.01rem;
|
||||
background-image: url("../img/index_031.jpg");
|
||||
background-repeat:no-repeat;
|
||||
background-size:100% 100%;
|
||||
-moz-background-size:100% 100%;
|
||||
}
|
||||
/*.index .header .banner .bannersearch .bottom ul{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
width: 100%;
|
||||
}*/
|
||||
/*.index .header .banner .bannersearch .bottom ul li:first-child{
|
||||
flex: 1;
|
||||
}*/
|
||||
.index .header .banner .bannersearch .bottom span{
|
||||
/*width: 1.2rem;*/
|
||||
font-size:0.2rem;
|
||||
color: #fff;
|
||||
padding:0.1rem 0.1rem;
|
||||
}
|
||||
|
||||
|
||||
.index .header .classify ul{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
}
|
||||
.index .header .classify ul li{
|
||||
flex:1;
|
||||
color: #fff;
|
||||
font-size: 0.2rem;
|
||||
text-align: center;
|
||||
margin:0.2rem 0.08rem;
|
||||
}
|
||||
.index .header .classify li a{
|
||||
display: block;
|
||||
color: #fff!important;
|
||||
font-size: 0.2rem;
|
||||
letter-spacing: 20px;
|
||||
text-indent:20px;
|
||||
text-align: center;
|
||||
line-height: 0.3rem;
|
||||
height: 0.3rem;
|
||||
padding:0.23rem 0;
|
||||
}
|
||||
|
||||
/*页面内容部分*/
|
||||
.content .contenthot .info{
|
||||
/*max-width: 32rem;*/
|
||||
}
|
||||
.content .contenthot ul{
|
||||
/*max-width: 32rem;*/
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
flex-wrap:wrap;
|
||||
justify-content: space-around; /*项目两侧对其*/
|
||||
}
|
||||
.content .contenthot ul li{
|
||||
/*flex:1;*/
|
||||
width:16%;
|
||||
background: #f7f7f7;
|
||||
margin:0 0.3% 0.7%;
|
||||
padding:0.2rem;
|
||||
}
|
||||
.content .contenthot ul li>div{
|
||||
/*background: #fff;*/
|
||||
}
|
||||
.content .contenthot ul li>div img{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.content .contenthot .info .operation{
|
||||
font-size:0.16rem;
|
||||
color: #666;
|
||||
height: 0.2rem;
|
||||
line-height: 0.2rem;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: space-between; /*向两侧对齐*/
|
||||
}
|
||||
.content .contenthot .info .description{
|
||||
font-size:0.16rem;
|
||||
color: #666;
|
||||
height: 0.3rem;
|
||||
line-height: 0.3rem;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content: space-between; /*向两侧对齐*/
|
||||
}
|
||||
.content .contenthot .info .operation img,.content .contenthot .info .description img{
|
||||
height: 0.2rem;
|
||||
line-height: 0.2rem;
|
||||
width: auto;
|
||||
}
|
||||
.content .contenthot .info .operation .left,.content .contenthot .info .operation .right{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
}
|
||||
.content .contenthot .info .operation .left img{
|
||||
padding-right: 0.05rem;
|
||||
}
|
||||
.content .contenthot .info .operation .left span{
|
||||
flex:1;
|
||||
line-height: 0.2rem;
|
||||
height: 0.2rem;
|
||||
font-size:0.2rem!important;
|
||||
color:#dd2024;
|
||||
font-weight: 500;
|
||||
|
||||
}
|
||||
.content .contenthot .info .operation .right img{
|
||||
flex:1;
|
||||
padding-left:0.1rem;
|
||||
}
|
||||
|
||||
.content .contenthot .info .operation .right img:nth-child(2){
|
||||
/*height: 0.15rem;*/
|
||||
|
||||
}
|
||||
.content .contenthot .info .description .left span{
|
||||
line-height: 0.25rem;
|
||||
height: 0.25rem;
|
||||
color:#666;
|
||||
font-size:0.14rem!important;
|
||||
}
|
||||
.content .contenthot .info .description .right img{
|
||||
line-height: 0.25rem;
|
||||
height: 0.25rem;
|
||||
color:#666;
|
||||
font-size:0.14rem!important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*新闻咨询*/
|
||||
.new .contentnew li {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
width: 100%;
|
||||
}
|
||||
.new .contentnew li>div{
|
||||
flex:1;
|
||||
}
|
||||
.new .contentnew li .left>div{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content:flex-end;
|
||||
}
|
||||
.new .contentnew .second .left>div{
|
||||
justify-content:flex-start;
|
||||
}
|
||||
|
||||
.new .contentnew li .right>div{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content:flex-start;
|
||||
align-items:center;
|
||||
}
|
||||
.new .contentnew .second .right>div{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.new .contentnew li .right>div>div{
|
||||
padding: 0rem 0.8rem;
|
||||
flex:1;
|
||||
}
|
||||
.new .contentnew li>div>div img{
|
||||
flex:1;
|
||||
padding: 0.25rem;
|
||||
}
|
||||
.new .contentnew li .title,.new .contentnew li .descript,.new .contentnew li .time{
|
||||
color: #fff;
|
||||
}
|
||||
.new .contentnew li .right .title{
|
||||
font-size:0.3rem;
|
||||
position: relative;
|
||||
}
|
||||
.new .contentnew li .right .border{
|
||||
margin:0.2rem 0;
|
||||
padding: 1px;
|
||||
box-shadow: inset 0 0 0 1px rgba(255,255,255,0.4);
|
||||
}
|
||||
/*半透明边框*/
|
||||
/*
|
||||
.new .contentnew li .right .title::after{
|
||||
position: absolute;
|
||||
top: 0.2rem;
|
||||
background: transparent;
|
||||
border:1px solid #fff;
|
||||
opacity: 0.4;
|
||||
}
|
||||
*/
|
||||
|
||||
.new .contentnew li .right .descript{
|
||||
font-size:0.16rem;
|
||||
line-height: 0.3rem;
|
||||
height:1.2rem;
|
||||
}
|
||||
.new .contentnew li .right .time{
|
||||
font-size:0.20rem;
|
||||
text-align: right;
|
||||
}
|
||||
/*媒体*/
|
||||
|
||||
.contentnewer ul{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 1.35rem;
|
||||
}
|
||||
.contentnewer ul li{
|
||||
flex:1;
|
||||
background: #fff;
|
||||
margin:0 0.15rem;
|
||||
padding: 0.2rem;
|
||||
/*height: 0.6rem;*/
|
||||
}
|
||||
|
||||
.contentnewer ul li .info{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.contentnewer ul li .title {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
.contentnewer ul li .title .name{
|
||||
flex: 2;
|
||||
height: 0.4rem;
|
||||
line-height: 0.4rem;
|
||||
}
|
||||
.contentnewer ul li .title .name span{
|
||||
color: #333;
|
||||
font-size:0.16rem;
|
||||
line-height: 0.3rem;
|
||||
padding: 0.05rem ;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
.contentnewer ul li .title .pic{
|
||||
flex: 1;
|
||||
}
|
||||
.contentnewer ul li .title .pic img{
|
||||
width: 100%;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: -0.4rem;
|
||||
box-shadow: 0 0 0 10px rgba(255,255,255,0.5);
|
||||
}
|
||||
.contentnewer ul li .descript{
|
||||
margin-top: 0.2rem;
|
||||
line-height: 0.25rem;
|
||||
height: 0.75rem;
|
||||
font-size:0.14rem;
|
||||
color:#666;
|
||||
}
|
||||
.contentnewer ul li .author{
|
||||
margin-top: 0.2rem;
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content:space-between;
|
||||
}
|
||||
.contentnewer ul li .author div{
|
||||
height: 0.3rem;
|
||||
}
|
||||
.contentnewer ul li .author div img{
|
||||
height: 0.3rem;
|
||||
}
|
||||
.contentnewer ul li .author .right{
|
||||
width: 0.8rem;
|
||||
}
|
||||
.contentnewer ul li .author div p{
|
||||
color: #333;
|
||||
font-size:0.14rem;
|
||||
line-height: 0.2rem;
|
||||
padding: 0.05rem ;
|
||||
text-align: center;
|
||||
border:1px solid #e3e3e3;
|
||||
width: 0.8rem;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*页面footer*/
|
||||
.footer {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.footer .topinfo>div{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content:space-around;
|
||||
}
|
||||
.footer .topinfo>div .left{
|
||||
flex:2;
|
||||
}
|
||||
.footer .topinfo>div .center{
|
||||
flex:7;
|
||||
}
|
||||
.footer .topinfo>div .right{
|
||||
flex:4;
|
||||
}
|
||||
/*.footer .topinfo>div .left img{
|
||||
height: 1.8rem;
|
||||
width: 1.6rem;
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
.footer .topinfo .center{
|
||||
padding: 0.2rem;
|
||||
}
|
||||
.footer .topinfo .center ul{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.footer .topinfo .center ul li{
|
||||
width:33%;
|
||||
}
|
||||
.footer .topinfo .center ul li img{
|
||||
width:auto;
|
||||
}
|
||||
.footer .topinfo .center ul li:nth-child(4){
|
||||
width:100%;
|
||||
margin-top: -10%;
|
||||
}
|
||||
.footer .topinfo .center ul li:nth-child(4) img{
|
||||
width:auto;
|
||||
}
|
||||
|
||||
.footer .topinfo .center ul li p{
|
||||
color: #fff;
|
||||
font-size:1rem;
|
||||
line-height: 0.4rem;
|
||||
height: 0.4rem;
|
||||
margin-top: 5%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.footer .topinfo .right{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
}
|
||||
.footer .topinfo .right>div{
|
||||
flex:1;
|
||||
}
|
||||
.footer .topinfo .right>div p{
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
line-height: 0.3rem;
|
||||
padding: 0.05rem;
|
||||
/* text-align: center; */
|
||||
margin-top: 10%;
|
||||
margin-right: 20%;
|
||||
}
|
||||
.footer .topinfo .right>div img{
|
||||
width: 8rem;
|
||||
margin: 0 auto;
|
||||
margin-top: 40%;
|
||||
}
|
||||
.footer .footerinfo>div{
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
justify-content:space-around;
|
||||
}
|
||||
.footer .footerinfo>div p{
|
||||
flex:2;
|
||||
color:#fff;
|
||||
height: 0.65rem;
|
||||
line-height: 0.65rem;
|
||||
}
|
||||
.footer .footerinfo>div p:first-child{
|
||||
flex:1;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user