|
|
@@ -1,136 +1,96 @@ |
|
|
|
<template>
|
|
|
|
<div class="Box">
|
|
|
|
<slideshow :list="slideList" />
|
|
|
|
<div class="textBox">
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>生活服务</span>
|
|
|
|
<span class="des">Life service</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>商品服务</span>
|
|
|
|
<span class="des">Business services</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>房屋租售</span>
|
|
|
|
<span class="des">Housing rental and sale</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>车辆相关</span>
|
|
|
|
<span class="des">Vehicle related</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>宠物市场</span>
|
|
|
|
<span class="des">Pet market</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>餐饮美食</span>
|
|
|
|
<span class="des">Food and beverage</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>名企招聘</span>
|
|
|
|
<span class="des">Recruitment of famous enterprises</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>教育培训</span>
|
|
|
|
<span class="des">Education and training</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>票务卡券</span>
|
|
|
|
<span class="des">Ticket card</span>
|
|
|
|
</a>
|
|
|
|
<!-- <div class="textLogo"></div>
|
|
|
|
<div class="headline">
|
|
|
|
<textTitle text="瑜璟缘国际文化礼仪介绍" />
|
|
|
|
<div class="article">
|
|
|
|
<div
|
|
|
|
class="text"
|
|
|
|
>  北京瑜璟缘国际文化发展有限公司是一所集形象管理培训(设计)、礼仪文化培训及策划运营管理为一体的专注于孕育及培养提升人才素养的专业培训机构。在全国拥有近200人的专业的签约礼仪咨询顾问和专家队伍,专注于为企业提供系统礼仪管理咨询与业务解决方案,为企业搭建高素质人才培养平台,为企业形象及人素养教育提升开辟有效途径,帮助企业完善礼仪文化建设,是国内多家企事业单位背后最有效的形象生产及教育培训基地。公司以“不学礼,无以立。”的宗旨,秉承“无问题,不培训”的运营理念,致力于打造新经济下交流分享、提升自我,创新升级,共享共赢生态圈的高端商业精英交流平台。专注于为企业家、创业者、企业高管提供创新升级的商业课程,高效落地的企业内训,垂直定向的主题沙龙,拓展视野的海外游学以及资源整合等培训咨询共享共赢服务解决方案。</div>
|
|
|
|
<img src="../../assets/img/home/textImg.png" />
|
|
|
|
<div class="row service">
|
|
|
|
<div class="bus col">
|
|
|
|
<h1><span>商务服务</span><a @click="more(11)">MORE+</a></h1>
|
|
|
|
<div class="bus_con">
|
|
|
|
<img :src="busOneData.mainPicRealPath" alt="" class="fl">
|
|
|
|
<div class="con_txt fr">
|
|
|
|
<div class="headline" @click="goparticulars(busOneData)">
|
|
|
|
<h6>{{busOneData.title}}</h6>
|
|
|
|
<p v-html="busOneData.content"></p>
|
|
|
|
<!-- <a href="#">[详细]</a> -->
|
|
|
|
</div>
|
|
|
|
<ul class="list">
|
|
|
|
<li v-for="(bus, index) in busList" :key="index">
|
|
|
|
<a @click="goparticulars(bus)"> {{bus.title}} </a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div> -->
|
|
|
|
</div>
|
|
|
|
<div class="life col">
|
|
|
|
<h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1>
|
|
|
|
<ul class="list">
|
|
|
|
<li v-for="(item, index) in lifeList" :key="index">
|
|
|
|
<a @click="goparticulars(item)"> {{item.title}} </a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="advisoryBox">
|
|
|
|
<div class="left">
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<div class="cls_list">
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>生活服务</span>
|
|
|
|
<span class="des">Life service</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>商品服务</span>
|
|
|
|
<span class="des">Business services</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>房屋租售</span>
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>房屋租赁</span>
|
|
|
|
<span class="des">Housing rental and sale</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>车辆相关</span>
|
|
|
|
<span class="des">Vehicle related</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>宠物市场</span>
|
|
|
|
<span class="des">Pet market</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>餐饮美食</span>
|
|
|
|
<span class="des">Food and beverage</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>名企招聘</span>
|
|
|
|
<span class="des">Recruitment of famous enterprises</span>
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>票务卡券</span>
|
|
|
|
<span class="des">Ticket card</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>教育培训</span>
|
|
|
|
<span class="des">Education and training</span>
|
|
|
|
</a>
|
|
|
|
<a href="javascript:void(0);" class="left_list">
|
|
|
|
<span>票务卡券</span>
|
|
|
|
<span class="des">Ticket card</span>
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>名企招聘</span>
|
|
|
|
<span class="des">Recruitment of famous enterprises</span>
|
|
|
|
</a>
|
|
|
|
<!-- <a
|
|
|
|
href="http://wpa.qq.com/msgrd?v=3&uin=30397378&site=qq&menu=yes"
|
|
|
|
target="view_window"
|
|
|
|
class="iconBox"
|
|
|
|
>
|
|
|
|
<div class="icon icon1"></div>
|
|
|
|
<div class="text">免费质询</div>
|
|
|
|
|
|
|
|
<a href="javascript:void(0);">
|
|
|
|
<span>商品服务</span>
|
|
|
|
<span class="des">Business services</span>
|
|
|
|
</a>
|
|
|
|
<div class="iconBox" @click="go('famousTeacher?tag=zj')">
|
|
|
|
<div class="iconLeft icon2"></div>
|
|
|
|
<div class="textLeft">授课名师</div>
|
|
|
|
</div>
|
|
|
|
<div class="iconBox" @click="go('course')">
|
|
|
|
<div class="icon icon3"></div>
|
|
|
|
<div class="text">热门课程</div>
|
|
|
|
</div>
|
|
|
|
<div class="iconBox" @click="go('excellent')">
|
|
|
|
<div class="iconLeft icon4"></div>
|
|
|
|
<div class="textLeft">企业培训优秀案例</div>
|
|
|
|
</div> -->
|
|
|
|
<div class="partnerBox">
|
|
|
|
<div class="title">合作伙伴</div>
|
|
|
|
<div class="partner" v-for="(item, index) in partnersList" :key="index">
|
|
|
|
<partnerBox :url="item.mainPicRealPath" :link="item.linkUrl" />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="cate row">
|
|
|
|
<div class="col" v-for="(item, index) in cateList" :key="index">
|
|
|
|
<h1><span>{{item.title}}</span><a @click="more(item.type)">MORE+</a></h1>
|
|
|
|
<ul class="list">
|
|
|
|
<li v-for="(con, idx) in item.list" :key="idx">
|
|
|
|
<a @click="goparticulars(con)"> {{con.title}} </a>
|
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="right">
|
|
|
|
<div class="journalismTitle">
|
|
|
|
<p>新闻中心</p>
|
|
|
|
<span @click="moreNews">MORE</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="journalismBox" v-for="(item, index) in newsList" :key="index" @click="goparticulars(item)">
|
|
|
|
<img class="logo" :src="item.mainPicRealPath" alt />
|
|
|
|
<div class="journalismText">
|
|
|
|
<h3>{{item.title}}</h3>
|
|
|
|
<span class="journalismText-content" v-html="item.content"></span>
|
|
|
|
<div class="time">{{item.publishDate}} <span class="el-icon-view"> {{item.view}}</span></div>
|
|
|
|
</div>
|
|
|
|
<div class="row lifeSer">
|
|
|
|
<div class="col">
|
|
|
|
<h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1>
|
|
|
|
<div class="imgList">
|
|
|
|
<a v-for="(item, index) in lifeList" :key="index" @click="goparticulars(item)">
|
|
|
|
<img :src="item.mainPicRealPath" alt="">
|
|
|
|
<span>{{item.title}}</span>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="attention">IBIE全球杂志</div>
|
|
|
|
<consult />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@@ -147,13 +107,48 @@ export default { |
|
|
|
slideshow,
|
|
|
|
consult,
|
|
|
|
textTitle,
|
|
|
|
partnerBox,
|
|
|
|
partnerBox
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
slideList: [],
|
|
|
|
partnersList: [],
|
|
|
|
newsList: []
|
|
|
|
newsList: [],
|
|
|
|
busOneData: {},
|
|
|
|
busList: [],
|
|
|
|
cateList: [
|
|
|
|
{
|
|
|
|
title: '房屋租赁',
|
|
|
|
type: 5,
|
|
|
|
list: []
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '宠物市场',
|
|
|
|
type: 6,
|
|
|
|
list: []
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '餐饮美食',
|
|
|
|
type: 7,
|
|
|
|
list: []
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '票务卡券',
|
|
|
|
type: 8,
|
|
|
|
list: []
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '教育培训',
|
|
|
|
type: 9,
|
|
|
|
list: []
|
|
|
|
},
|
|
|
|
{
|
|
|
|
title: '企业招聘',
|
|
|
|
type: 10,
|
|
|
|
list: []
|
|
|
|
}
|
|
|
|
],
|
|
|
|
lifeList: [], // 生活服务
|
|
|
|
};
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
@@ -180,24 +175,33 @@ export default { |
|
|
|
/* 新闻列表 */
|
|
|
|
getNewsList() {
|
|
|
|
let data = {
|
|
|
|
type: 1,
|
|
|
|
// type: 1,
|
|
|
|
pageNum: 1,
|
|
|
|
pageSize: 3
|
|
|
|
pageSize: 10
|
|
|
|
}
|
|
|
|
homeService.getNewsList(data).then(res => {
|
|
|
|
res.list.forEach(ele => {
|
|
|
|
ele.publishDate = moment(ele.publishDate).format("YYYY-MM-DD")
|
|
|
|
ele.content = ele.content.replace(/<img\b[^>]*>/, "");
|
|
|
|
if (ele.type == 4) { // 生活服务
|
|
|
|
this.lifeList.push(ele)
|
|
|
|
} else if (ele.type == 11) {
|
|
|
|
this.busList.push(ele)
|
|
|
|
this.busOneData = this.busList[0]
|
|
|
|
} else {
|
|
|
|
this.cateList.forEach(cate => {
|
|
|
|
if(ele.type == cate.type) {
|
|
|
|
cate.list.push(ele)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
});
|
|
|
|
this.newsList = res.list
|
|
|
|
})
|
|
|
|
},
|
|
|
|
moreNews() {
|
|
|
|
this.$router.push('/journalism');
|
|
|
|
},
|
|
|
|
goparticulars(item) {
|
|
|
|
let detailId= item.id + ".html"
|
|
|
|
this.$router.push({name: "particulars",params:{ id: detailId, ifjournalism: 2}})
|
|
|
|
this.$router.push({name: "particulars",params:{ id: detailId, ifjournalism: item.type}})
|
|
|
|
},
|
|
|
|
more(tag) {
|
|
|
|
this.$router.push({path: "/journalism",query:{tag: tag}});
|
|
|
|
},
|
|
|
|
go(path) {
|
|
|
|
this.$router.push(`/${path}`);
|
|
|
@@ -206,6 +210,7 @@ export default { |
|
|
|
created() {
|
|
|
|
this.getSlideList()
|
|
|
|
this.getPartnersList()
|
|
|
|
|
|
|
|
this.getNewsList()
|
|
|
|
}
|
|
|
|
};
|
|
|
@@ -216,261 +221,196 @@ export default { |
|
|
|
width: 1200px;
|
|
|
|
margin: 0 auto;
|
|
|
|
overflow: hidden;
|
|
|
|
.textBox {
|
|
|
|
margin: 10px 0;
|
|
|
|
height: 286px;
|
|
|
|
border: 1px rgb(238, 238, 238) solid;
|
|
|
|
position: relative;
|
|
|
|
display: flex;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
justify-content: space-between;
|
|
|
|
.left_list{
|
|
|
|
width: 30%;
|
|
|
|
height: 66px;
|
|
|
|
.fl {
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
.fr {
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
.row{
|
|
|
|
.col{
|
|
|
|
float: left;
|
|
|
|
background: rgba(75,161,107,0.9);
|
|
|
|
color: #fff;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
flex-flow: column;
|
|
|
|
margin: 10px;
|
|
|
|
border-radius: 6px;
|
|
|
|
span{
|
|
|
|
display: block;
|
|
|
|
line-height: 16px;
|
|
|
|
margin: 0 10px;
|
|
|
|
box-shadow: 0 0 10px #f3f3f3;
|
|
|
|
background: #fff;
|
|
|
|
a{
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
ul.list{
|
|
|
|
li {
|
|
|
|
width: 288px;
|
|
|
|
overflow: hidden;
|
|
|
|
line-height: 22px;
|
|
|
|
padding: 4px 0;
|
|
|
|
height: 22px;
|
|
|
|
a{
|
|
|
|
color: #333;
|
|
|
|
}
|
|
|
|
a:hover{
|
|
|
|
color: #2979d0
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.textLogo {
|
|
|
|
height: 70px;
|
|
|
|
width: 70px;
|
|
|
|
// background-color: cornsilk;
|
|
|
|
background-image: url("../../assets/img/home/angleTop.png");
|
|
|
|
top: 0;
|
|
|
|
left: 0;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
.headline {
|
|
|
|
color: #1e1f4c;
|
|
|
|
margin-left: 150px;
|
|
|
|
|
|
|
|
.article {
|
|
|
|
overflow: hidden;
|
|
|
|
.text {
|
|
|
|
float: left;
|
|
|
|
width: 700px;
|
|
|
|
font-size: 14px;
|
|
|
|
line-height: 25px;
|
|
|
|
}
|
|
|
|
h1{
|
|
|
|
height: 48px;
|
|
|
|
border-bottom: 1px solid #dfe2e7;
|
|
|
|
line-height: 48px;
|
|
|
|
font-weight: normal;
|
|
|
|
padding: 0 20px;
|
|
|
|
span{
|
|
|
|
float: left;
|
|
|
|
height: 47px;
|
|
|
|
line-height: 47px;
|
|
|
|
border-bottom: 2px solid #137ccd;
|
|
|
|
font-size: 16px;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
a{
|
|
|
|
float: right;
|
|
|
|
color: #137ccd;
|
|
|
|
font-style: italic;
|
|
|
|
font-size: 12px;
|
|
|
|
line-height: 48px;
|
|
|
|
transition: 0.3s;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.bus{
|
|
|
|
width: 780px;
|
|
|
|
height: 100%;
|
|
|
|
display: inline-block;
|
|
|
|
.bus_con {
|
|
|
|
padding: 20px;
|
|
|
|
img {
|
|
|
|
width: 150px;
|
|
|
|
height: 150px;
|
|
|
|
border-radius: 50%;
|
|
|
|
background-color: cyan;
|
|
|
|
float: right;
|
|
|
|
margin-right: 50px;
|
|
|
|
width: 368px;
|
|
|
|
height: 238px;
|
|
|
|
}
|
|
|
|
.con_txt{
|
|
|
|
width: 352px;
|
|
|
|
ul{
|
|
|
|
height: 172px;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
.headline{
|
|
|
|
border-bottom: 1px dashed #dadada;
|
|
|
|
padding-bottom: 10px;
|
|
|
|
cursor: pointer;
|
|
|
|
h6{
|
|
|
|
font-size: 16px;
|
|
|
|
font-weight: bold;
|
|
|
|
line-height: 24px;
|
|
|
|
}
|
|
|
|
p{
|
|
|
|
line-height: 22px;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 2;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
overflow: hidden;
|
|
|
|
a{
|
|
|
|
color: #2979d0 !important;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.life{
|
|
|
|
width: 380px;
|
|
|
|
height: 100%;
|
|
|
|
overflow: hidden;
|
|
|
|
ul{
|
|
|
|
padding: 10px 20px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.advisoryBox {
|
|
|
|
overflow: hidden;
|
|
|
|
.left {
|
|
|
|
float: left;
|
|
|
|
width: 26%;
|
|
|
|
border-top: 1px rgb(238, 238, 238) solid;
|
|
|
|
.left_list{
|
|
|
|
width: 250px;
|
|
|
|
height: 56px;
|
|
|
|
display: block;
|
|
|
|
background: rgba(75,161,107,0.9);
|
|
|
|
color: #fff;
|
|
|
|
|
|
|
|
.service{
|
|
|
|
height: 330px;
|
|
|
|
margin-bottom: 20px;
|
|
|
|
a{
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.cls_list{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
flex-flow: column;
|
|
|
|
// margin: 10px auto 0;
|
|
|
|
margin: 10px 0;
|
|
|
|
border-radius: 6px;
|
|
|
|
span{
|
|
|
|
display: block;
|
|
|
|
line-height: 16px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.iconBox {
|
|
|
|
overflow: hidden;
|
|
|
|
margin: 10px 0;
|
|
|
|
position: relative;
|
|
|
|
height: 80px;
|
|
|
|
display: block;
|
|
|
|
color: #000;
|
|
|
|
cursor: pointer;
|
|
|
|
.icon {
|
|
|
|
width: 75px;
|
|
|
|
height: 75px;
|
|
|
|
background-color: #999999;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 20px;
|
|
|
|
top: 5px;
|
|
|
|
}
|
|
|
|
.icon1 {
|
|
|
|
background-image: url("../../assets/img/home/icon-1.png");
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-size: 30px;
|
|
|
|
background-position: center center;
|
|
|
|
}
|
|
|
|
.icon2 {
|
|
|
|
background-image: url("../../assets/img/home/icon-2.png");
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-size: 30px;
|
|
|
|
background-position: center center;
|
|
|
|
justify-content: space-between;
|
|
|
|
width: 100%;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
a{
|
|
|
|
width: 23%;
|
|
|
|
height: 66px;
|
|
|
|
display: block;
|
|
|
|
background: rgba(75,161,107,0.9);
|
|
|
|
color: #fff;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
flex-flow: column;
|
|
|
|
margin: 10px;
|
|
|
|
border-radius: 4px;
|
|
|
|
}
|
|
|
|
.icon3 {
|
|
|
|
background-image: url("../../assets/img/home/icon-3.png");
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-size: 30px;
|
|
|
|
background-position: center center;
|
|
|
|
a:nth-of-type(odd){
|
|
|
|
background: rgba(75,161,107,0.9);
|
|
|
|
}
|
|
|
|
.icon4 {
|
|
|
|
background-image: url("../../assets/img/home/icon-4.png");
|
|
|
|
background-repeat: no-repeat;
|
|
|
|
background-size: 30px;
|
|
|
|
background-position: center center;
|
|
|
|
a:nth-of-type(even){
|
|
|
|
background: #CCA140;
|
|
|
|
}
|
|
|
|
.text {
|
|
|
|
width: 230px;
|
|
|
|
height: 45px;
|
|
|
|
background-color: #eeeeee;
|
|
|
|
border-radius: 50px;
|
|
|
|
line-height: 45px;
|
|
|
|
margin-top: 20px;
|
|
|
|
margin-left: 20px;
|
|
|
|
text-indent: 100px;
|
|
|
|
border: #cccccc 1px solid;
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
.iconLeft {
|
|
|
|
width: 75px;
|
|
|
|
height: 75px;
|
|
|
|
background-color: #999999;
|
|
|
|
border-radius: 50%;
|
|
|
|
position: absolute;
|
|
|
|
left: 180px;
|
|
|
|
top: 5px;
|
|
|
|
}
|
|
|
|
.textLeft {
|
|
|
|
width: 230px;
|
|
|
|
height: 45px;
|
|
|
|
background-color: #eeeeee;
|
|
|
|
border-radius: 50px;
|
|
|
|
line-height: 45px;
|
|
|
|
margin-top: 20px;
|
|
|
|
margin-left: 20px;
|
|
|
|
text-indent: 40px;
|
|
|
|
border: #cccccc 1px solid;
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.partnerBox {
|
|
|
|
width: 80%;
|
|
|
|
overflow: hidden;
|
|
|
|
.title {
|
|
|
|
font-size: 14px;
|
|
|
|
background-color: #eee;
|
|
|
|
font-weight: bolder;
|
|
|
|
height: 40px;
|
|
|
|
text-indent: 50px;
|
|
|
|
line-height: 40px;
|
|
|
|
|
|
|
|
}
|
|
|
|
.partner{
|
|
|
|
width: 80%;
|
|
|
|
margin: 0 10%;
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
.cate{
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
width: 100%;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
.col{
|
|
|
|
width: 380px;
|
|
|
|
height: 268px;
|
|
|
|
margin: 10px;
|
|
|
|
overflow: hidden;
|
|
|
|
a{
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.right {
|
|
|
|
width: 70%;
|
|
|
|
float: right;
|
|
|
|
overflow: hidden;
|
|
|
|
.journalismTitle {
|
|
|
|
margin: 10px 0;
|
|
|
|
background-color: rgb(232, 232, 232);
|
|
|
|
overflow: hidden;
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
|
|
p {
|
|
|
|
width: 200px;
|
|
|
|
height: 45px;
|
|
|
|
line-height: 45px;
|
|
|
|
text-indent: 30px;
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
span {
|
|
|
|
height: 45px;
|
|
|
|
line-height: 45px;
|
|
|
|
text-indent: 30px;
|
|
|
|
float: right;
|
|
|
|
margin-right: 20px;
|
|
|
|
cursor: pointer;
|
|
|
|
.list {
|
|
|
|
padding: 10px 20px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.lifeSer{
|
|
|
|
width: 1182px;
|
|
|
|
min-height: 300px;
|
|
|
|
.col{
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.lifeSer{
|
|
|
|
.imgList{
|
|
|
|
display: flex;
|
|
|
|
/* align-items: center;
|
|
|
|
justify-content: space-between; */
|
|
|
|
width: 100%;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
text-align: center;
|
|
|
|
a{
|
|
|
|
img{
|
|
|
|
width: 198px;
|
|
|
|
height: 150px;
|
|
|
|
transition: 0.4s;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.journalismBox {
|
|
|
|
overflow: hidden;
|
|
|
|
border-bottom: rgb(232, 232, 232) 1px solid;
|
|
|
|
margin: 5px 0;
|
|
|
|
cursor: pointer;
|
|
|
|
.logo {
|
|
|
|
background-color: rosybrown;
|
|
|
|
height: 110px;
|
|
|
|
width: 140px;
|
|
|
|
float: left;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
margin-right: 20px;
|
|
|
|
background-image: url(/img/on1.688f88b1.png);
|
|
|
|
margin-top: 10px;
|
|
|
|
img:hover{
|
|
|
|
transform: scale(1.2);/*鼠标放上之后元素变成1.4倍大小*/
|
|
|
|
}
|
|
|
|
.journalismText {
|
|
|
|
float: left;
|
|
|
|
width: 660px;
|
|
|
|
h3 {
|
|
|
|
width: 90%;
|
|
|
|
margin: 5px 0;
|
|
|
|
font-size: 16px;
|
|
|
|
}
|
|
|
|
span.journalismText-content {
|
|
|
|
min-height: 60px;
|
|
|
|
overflow: hidden;
|
|
|
|
line-height: 19px;
|
|
|
|
color: #999;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 3;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
.time {
|
|
|
|
line-height: 19px;
|
|
|
|
color: rgb(214, 214, 206);
|
|
|
|
padding: 10px 0;
|
|
|
|
span{
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
span{
|
|
|
|
display: block;
|
|
|
|
color: #333;
|
|
|
|
margin-top: 20px;
|
|
|
|
}
|
|
|
|
margin: 20px;
|
|
|
|
}
|
|
|
|
.attention {
|
|
|
|
margin: 20px 0;
|
|
|
|
background-color: rgb(153, 153, 153);
|
|
|
|
overflow: hidden;
|
|
|
|
font-size: 14px;
|
|
|
|
height: 45px;
|
|
|
|
line-height: 45px;
|
|
|
|
text-indent: 30px;
|
|
|
|
color: rgb(241, 255, 255);
|
|
|
|
a:not(:nth-child(4n)) {
|
|
|
|
margin-right: calc(4% / 3);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|