交互优化

jpress-web-template-mallcms/src/main/webapp/templates/mallcms/assets/css/index.css

@@ -227,7 +227,7 @@ body{
     border-right: none;
 }
 .adv .adv-list p{
-    margin: 30px auto 16px;
+    margin: 22px auto 16px;
     font-size: 16px;
     color: #fff;
 }
@@ -389,7 +389,7 @@ body{
 .main-section .main .main-des .scroll .store-hr{
     position: absolute;
     margin-top: -12px;
-    width: 100%;
+    width: 96.8%;;
     border: 1px dashed #f0f0f0;
 }
 .main-section .main .main-des .scroll .item-list:hover a.btn{
@@ -530,8 +530,6 @@ body{
     left: 250px;
     width: 100px;
     height: 90px;
-    box-shadow: 0px 7px 8px 0px;
-rgba(79, 79, 79, 0.15);
 }
 .buy_content .buy_item_list .buy_list_small {
     padding-top: 30px;
@@ -546,8 +544,6 @@ rgba(79, 79, 79, 0.15);
     margin: 10px auto;
     width: 65px;
     height: 65px;
-    box-shadow: 0px 7px 8px 0px;
-rgba(79, 79, 79, 0.15);
 }
 .buy_content .buy_item_list .buy_list_small p{
     margin-bottom: 8px;
@@ -911,7 +907,7 @@ td.inquiry_btn a{
     margin-bottom: 35px;
 }
 .c_main .c_content .c_item_list ul li div{
-    max-width: 160px;
+    max-width: 230px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -937,7 +933,6 @@ td.inquiry_btn a{
     font-size: 14px;
     color: #333333;
     display: inline-block;
-    /*width: 120px;*/
     margin-left: 13px;
 }
 .c_main .c_content .c_item_list ul li a.c_width{
@@ -968,8 +963,8 @@ td.inquiry_btn a{
 .c_main .c_content .c_item_list ul li span.c_price{
     display: inline-block;
     float: left;
-    width: 110px;
-    margin: 0 47px 0 50px;
+    width: 80px;
+    margin: 0 18px;
     font-size: 14px;
     color: #e41f2b;
 }
@@ -986,7 +981,7 @@ td.inquiry_btn a{
     width: 90px;
     font-size: 14px;
     color: #999;
-    margin-left: 54px;
+    margin-left: 14px;
 }
 .c_main .c_content .c_item_list ul li span.c_time img{
     margin-right: 5px;
@@ -1063,7 +1058,15 @@ td.inquiry_btn a{
     font-weight: bold;
     color: #ffffff;
 }
-.c_publish:hover{
+.c_publish a.first {
+    border-top-left-radius: 21px;
+    border-bottom-left-radius: 21px;
+}
+.c_publish a.last {
+    border-top-right-radius: 21px;
+    border-bottom-right-radius: 21px;
+}
+.c_publish a:hover{
     background: #e41f2b;
 }
 .c_right{
@@ -1079,7 +1082,7 @@ td.inquiry_btn a{
 .c_publish .c_publish_line{
     position: absolute;
     top: 12px;
-    left: 130px;
+    left: 128.5px;
     width: 1px;
     height: 21px;
     background-color: rgba(255,225,255,.8);
@@ -1421,8 +1424,6 @@ td.inquiry_btn a{
 }
 .k_content .k_item_list img{
     margin: 110px auto 34px;
-    width: 63px;
-    height: 63px;
 }
 .k_content .k_item_list p{
     margin-bottom: 20px;
@@ -1523,7 +1524,7 @@ td.inquiry_btn a{
 .k_among .k_among_bottom .k_list_one div{
     float: left;
     height: 20px;
-    width: 200px;
+    width: 195px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -1559,6 +1560,7 @@ td.inquiry_btn a{
     font-weight: bold;
 }
 .k_among .k_among_bottom .k_list_one .k_data{
+    margin-left: 9px;
     display: inline-block;
     width: 45px;
     font-size: 14px;
@@ -1616,7 +1618,7 @@ td.inquiry_btn a{
 }
 .x_content_head .cover>div{
     position:absolute;
-    bottom: 8px;
+    bottom: 10px;
     left: 0;
     width: 180px;
     padding: 0;
@@ -1666,11 +1668,32 @@ td.inquiry_btn a{
     overflow: hidden;
 }
 .x_content_head_text p.x_first.x_gray_overflow a{
+    position: relative;
     color: #232423;
     font-size: 16px;
 }
+.x_content_head_text p.x_first.x_gray_overflow a:before{
+    content: "";
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    height: 1px;
+    border-bottom: 2px solid #e41f2b;
+    width: 0px;
+    -webkit-transition: all 0.3s;
+    -moz-transition: all 0.3s;
+    -ms-transition: all 0.3s;
+    -o-transition: all 0.3s;
+    transition: all 0.3s;
+}
+.x_content_head_text p.x_first.x_gray_overflow:hover a:before{
+    width: 100%;
+    left: 0;
+}
 .x_content_head_text p.x_first.x_gray_overflow:hover a{
     color: #e41f2b;
+    font-weight: bold;
+    border-bottom: 3px solid #e41f2b;
 }
 .x_content_head_text p.x_gray_text a{
     font-size: 14px;
@@ -1696,6 +1719,9 @@ a.x_gray_text{
     font-size: 14px;
     color: #999;
 }
+a.x_gray_text.x_more{
+    font-weight: normal;
+}
 .x_gray_text {
     font-size: 14px;
     color: #999;
@@ -1715,10 +1741,12 @@ a.x_gray_text{
     color: #e41f2b;
 }
 .x_content_footer_list .x_gray_overflow{
-    width: 270px;
+    position: relative;
+    max-width: 270px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    text-align: left;
 }
 .x_content_footer_list p.x_gray_overflow:hover{
     color: #999;
@@ -1732,7 +1760,7 @@ a.x_gray_text{
 .x_content_footer_list a.x_gray_overflow:before{
     content: "";
     position: absolute;
-    bottom: 18px;
+    bottom: 0;
     left: 50%;
     height: 1px;
     border-bottom: 2px solid #e41f2b;
@@ -1774,6 +1802,10 @@ a.x_gray_text{
     border: 1px solid #e8e8e8;
     box-sizing: border-box;
 }
+.x_content_footer:hover{
+    box-shadow: 1px 12px 18px 0px
+    rgba(158, 158, 158, 0.4);
+}
 .x_item_title {
     height: 50px;
     line-height: 50px;
@@ -1817,6 +1849,10 @@ a.x_gray_text{
     padding: 0 16px 0 20px;
     text-align: left;
 }
+.x_content_head_hover:hover{
+    box-shadow: 1px 12px 18px 0px
+    rgba(158, 158, 158, 0.4);
+}
 .second_col img {
     width: 100%;
     height: 200px;
@@ -2024,6 +2060,7 @@ a.x_gray_text{
 }
 .footer-section ul>li:hover a{
     text-decoration: underline ;
+    color: #e41f2b;
 }
 .footer-section .about{
     float: left;

jpress-web-template-mallcms/src/main/webapp/templates/mallcms/index.html

@@ -420,7 +420,7 @@
 							</#assign>
 							<#assign json=text?eval />
 							<#list json.data.list as item>
-								<li><div style="width:160px; float: left;"><div class="c_cir"><a href="${item.url!}">${item.task_title!}</a></div></div><span class="c_price c-price">${item.cove_desc!}<b></b></span><span class="c_time"><img
+								<li><div style="width:230px; float: left;"><div class="c_cir"><a href="${item.url!}">${item.task_title!}</a></div></div><span class="c_price c-price">${item.cove_desc!}<b></b></span><span class="c_time"><img
 										src="${CTPATH}/assets/images/c_04.png" alt="">${item.start_time!}</span><span class="c_right"> &gt; </span></li>
 							</#list>
 						</@jp.apiData>
@@ -450,8 +450,8 @@
 				</div>
 				<div class="c_publish">
 					<div>
-						<a href="https://zb.uuzcc.com/pubtask.html"> <img src="${CTPATH}/assets/images/c_05.png" alt=""> 发布求购</a>
-						<a href="https://zb.uuzcc.com/user-view-transaction-op-add.html"><img src="${CTPATH}/assets/images/3_46.png" alt=""> 上传方案</a>
+						<a href="https://zb.uuzcc.com/pubtask.html" class="first"> <img src="${CTPATH}/assets/images/c_05.png" alt=""> 发布求购</a>
+						<a href="https://zb.uuzcc.com/user-view-transaction-op-add.html" class="last"><img src="${CTPATH}/assets/images/3_46.png" alt=""> 上传方案</a>
 						<div class="c_publish_line"></div>
 					</div>
 				</div>
@@ -530,7 +530,7 @@
                 <@jp.indexPage module="index_uas_carousel" orderBy="order_number ASC">
 				<ol class="carousel-indicators">
                     <#list page.getList() as content>
-                        <li data-target="#myCarousel" data-slide-to="${content_index!}" <#if content_index = 0>class="active"</#if>></li>
+                        <li data-target="#myCarousel01" data-slide-to="${content_index!}" <#if content_index = 0>class="active"</#if>></li>
                     </#list>
 				</ol>
 				<!-- 轮播（Carousel）项目 -->
@@ -655,7 +655,7 @@
 				<!--第一列-->
 				<div class="x_content_row">
 					<!--上部-->
-					<div class="x_content_head">
+					<div class="x_content_head x_content_head_hover">
 						<@jp.indexPage module="index_uk_coverman" pageSize="1">
 							<#list page.getList() as content>
 								<img src="${content.thumbnail!}" alt="${content.title!}">
@@ -663,7 +663,7 @@
 									<img src="${CTPATH}/assets/images/cover.png" alt="">
 									<div><span>封面人物</span><span>第二十期</span></div>
 								</div>
-								<div class="x_content_head_text">
+								<div class="x_content_head_text" style="padding: 10px;">
 									<p class="x_first x_gray_overflow"><a href="${content.flag!}">${content.title!}</a></p>
 									<p class="x_gray_text x_gray_overflow">
 										<span>${content.remarks!}</span>
@@ -677,7 +677,7 @@
 					<div class="x_content_footer">
 						<div class="x_item_title">
 							IC快讯
-							<a href="https://www.uuzcc.com/article/list/iczixun.html" class="x_gray_text">更多></a>
+							<a href="https://www.uuzcc.com/article/list/iczixun.html" class="x_gray_text x_more">更多></a>
 						</div>
 						<div class="x_content_footer_list">
 							<@jp.apiData id="news_ic">
@@ -708,7 +708,7 @@
 					<div class="x_content_head">
 						<div class="x_item_title">
 							热门话题集锦
-							<a href="https://www.uuzcc.com/article/list/activity_news.html" class="x_gray_text">更多></a>
+							<a href="https://www.uuzcc.com/article/list/activity_news.html" class="x_gray_text x_more">更多></a>
 						</div>
 						<div class="banner">
 							<div id="myCarousel02" class="carousel slide">
@@ -742,7 +742,7 @@
 					<div class="x_content_footer">
 						<div class="x_item_title">
 							智能家居
-							<a href="https://www.uuzcc.com/article/list/hardwarel.html" class="x_gray_text">更多></a>
+							<a href="https://www.uuzcc.com/article/list/hardwarel.html" class="x_gray_text x_more">更多></a>
 						</div>
 						<ul class="x_item_list">
 							<@jp.apiData id="news_smart_home">
@@ -769,7 +769,7 @@
 							<li class="title_list_active">
 								<span></span>热门资讯</li>
 						</ul>
-						<a href="https://www.uuzcc.com/article/list/iczixun.html" class="x_gray_text">更多></a>
+						<a href="https://www.uuzcc.com/article/list/iczixun.html" class="x_gray_text x_more">更多></a>
 					</div>
 					<div class="hot_info_list">
 						<!--最近-->