Skip to content

T
tea_resources_pc
Commit d2e6447f authored by 张伯涛's avatar 张伯涛
Browse files
Options

样式调整

parent 245ca909
Hide whitespace changes
Inline Side-by-side
Showing with 123 additions and 88 deletions
src/layout/components/Navbar.vue
View file @ d2e6447f
<template> <template>
<!-- <div class="navbar">--> <div class="navbar">
<!-- <breadcrumb class="breadcrumb-container" />--> <breadcrumb class="breadcrumb-container" />
<!-- </div>--> </div>
</template> </template>
<script> <script>
...@@ -46,7 +46,7 @@ export default { ...@@ -46,7 +46,7 @@ export default {
height: 50px; height: 50px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
background: #fff; //background: #fff;
//box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); //box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
margin: 0 14px; margin: 0 14px;
......
src/views/homePage/components/searchHome/index.vue
View file @ d2e6447f
...@@ -35,6 +35,7 @@ export default { ...@@ -35,6 +35,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.HomeSearch { .HomeSearch {
padding-top: 72px;
width: 100%; width: 100%;
height: 881px; height: 881px;
::v-deep .el-carousel__container{ ::v-deep .el-carousel__container{
......
src/views/news/details.vue
View file @ d2e6447f
...@@ -54,6 +54,7 @@ export default { ...@@ -54,6 +54,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.newsDetails_module{ .newsDetails_module{
padding-top: 72px;
width: 1920px; width: 1920px;
height: 2390px; height: 2390px;
background: #f5f9fd; background: #f5f9fd;
......
src/views/news/index.vue
View file @ d2e6447f
...@@ -2,30 +2,37 @@ ...@@ -2,30 +2,37 @@
<div> <div>
<nav-list :list="navList" /> <nav-list :list="navList" />
<div class="news_module"> <div class="news_module">
<div class="newsList"> <div class="news_navbar">
<div <div class="navbar_title">首页</div>
v-for="(item,index) in newsList" <div class="navbar_icon">></div>
:key="index" <div class="navbar_activeTitle">新闻资讯</div>
> </div>
<div class="dataList" @click="handleJumpDetails"> <div class="newsList_content">
<div> <div class="newsList">
<img class="newsImg" :src="item.img"> <div
</div> v-for="(item,index) in newsList"
<div class="news_content"> :key="index"
<div :title="item.title" class="newsTitle">{{ item.title }}</div> >
<div :title="item.info" class="newsInfo">{{ item.info }}</div> <div class="dataList" @click="handleJumpDetails">
<div class="newsDate">{{ item.date }}</div> <div>
<img class="newsImg" :src="item.img">
</div>
<div class="news_content">
<div :title="item.title" class="newsTitle">{{ item.title }}</div>
<div :title="item.info" class="newsInfo">{{ item.info }}</div>
<div class="newsDate">{{ item.date }}</div>
</div>
</div> </div>
<div class="newsRow_divider"><el-divider /></div>
</div> </div>
<div class="newsRow_divider"><el-divider /></div> <pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
</div> </div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
</div> </div>
</div> </div>
</div> </div>
...@@ -36,7 +43,7 @@ import NavList from '@/views/homePage/components/NavList/index' ...@@ -36,7 +43,7 @@ import NavList from '@/views/homePage/components/NavList/index'
export default { export default {
name: 'Index', name: 'Index',
components: { components: {
NavList NavList,
}, },
data() { data() {
return { return {
...@@ -105,11 +112,10 @@ export default { ...@@ -105,11 +112,10 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
.news_module{ .news_module{
margin: 72px 0 0 0;
width: 1920px; width: 1920px;
height: 3014px; height: 3014px;
background: #f5f9fd; background: #f5f9fd;
display: flex;
justify-content: center;
::v-deep .el-pagination{ ::v-deep .el-pagination{
display: flex; display: flex;
justify-content: center; justify-content: center;
...@@ -117,70 +123,97 @@ export default { ...@@ -117,70 +123,97 @@ export default {
.pagination-container{ .pagination-container{
padding: 38px 0 76px 0; padding: 38px 0 76px 0;
} }
.newsList{ .news_navbar{
padding: 64px 0 0 48px; padding: 24px 0 24px 385px;
margin: 69px 0 0 0; display: flex;
width: 1200px; align-items: center;
height: 2805px; font-size: 16px;
background: #ffffff; font-family: Source Han Sans CN, Source Han Sans CN-400;
border-radius: 2px; font-weight: 400;
box-shadow: -2px 0px 10px 2px rgba(0,0,0,0.04); color: #292929;
.dataList{ .navbar_icon{
cursor: pointer; position: relative;
display: flex; bottom: 2px;
.newsImg{ padding: 0 15px;
width: 274px; }
height: 154px; .navbar_activeTitle{
} color: #3888FC;
.news_content{ }
padding-left: 46px; }
.newsTitle{ .newsList_content{
overflow: hidden; display: flex;
text-overflow: ellipsis; justify-content: center;
-webkit-line-clamp: 2; .newsList{
-webkit-box-orient: vertical; padding: 64px 0 0 48px;
word-break: break-all;//数字和字母换行隐藏不生效时加上这行 width: 1200px;
white-space: nowrap;// div不换行属性 height: 2805px;
margin-bottom: 15px; background: #ffffff;
width: 606px; border-radius: 2px;
font-size: 20px; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.05);
font-family: Source Han Sans CN, Source Han Sans CN-Bold; .dataList{
font-weight: 700; cursor: pointer;
text-align: left; display: flex;
color: #232323; .newsImg{
width: 274px;
height: 154px;
} }
.newsInfo{ .news_content{
display: -webkit-box; padding-left: 46px;
-webkit-line-clamp: 3; /* 限制在三行 */ .newsTitle{
-webkit-box-orient: vertical; overflow: hidden;
overflow: hidden; text-overflow: ellipsis;
text-overflow: ellipsis; -webkit-line-clamp: 2;
height: 84px; /* 行高（line-height）乘以行数 */ -webkit-box-orient: vertical;
line-height: 28px; word-break: break-all;//数字和字母换行隐藏不生效时加上这行
word-break: break-all;//数字和字母换行隐藏不生效时加上这行 white-space: nowrap;// div不换行属性
margin-bottom: 19px; margin-bottom: 15px;
width: 778px; width: 606px;
font-size: 16px; font-size: 20px;
font-family: SourceHanSansCN, SourceHanSansCN-Regular; font-family: Source Han Sans CN, Source Han Sans CN-Bold;
font-weight: 400; font-weight: 700;
text-align: left; text-align: left;
color: #232323; color: #232323;
}
.newsTitle:hover{
color: #3888fc;
cursor: pointer;
}
.newsInfo{
display: -webkit-box;
-webkit-line-clamp: 3; /* 限制在三行 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
height: 84px; /* 行高（line-height）乘以行数 */
line-height: 28px;
word-break: break-all;//数字和字母换行隐藏不生效时加上这行
margin-bottom: 19px;
width: 778px;
font-size: 16px;
font-family: SourceHanSansCN, SourceHanSansCN-Regular;
font-weight: 400;
text-align: left;
color: #232323;
}
.newsDate{
font-size: 14px;
font-family: SourceHanSansCN, SourceHanSansCN-Regular;
font-weight: 400;
text-align: left;
color: #6f6f6f;
}
} }
.newsDate{ }
font-size: 14px; .newsRow_divider{
font-family: SourceHanSansCN, SourceHanSansCN-Regular; .el-divider--horizontal{
font-weight: 400; width: 1100px;
text-align: left; height: 2px;
color: #6f6f6f; background: #f5f9fd;
margin: 50px 0;
} }
} }
} .news_pagination{
.newsRow_divider{
.el-divider--horizontal{
width: 1100px;
height: 2px;
background: #f5f9fd;
margin: 50px 0;
} }
} }
} }
......
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