常见问题演示文档页面添加交互效果

jpress-web-template-usoftchina/src/main/webapp/templates/usoftchina/taxonomy_demoDocument.html

@@ -46,22 +46,22 @@
     overflow: hidden;
     margin-bottom: 60px;
     }
-    .breadcrumb .content{
+    .breadcrumbs .content{
     margin-bottom: 0;
     text-align: left;
     }
-    .breadcrumb ul{
+    .breadcrumbs ul{
     overflow: hidden;
     display: inline-block;
     text-align: left;
     }
-    .breadcrumb ul li{
+    .breadcrumbs ul li{
     float: left;
     margin-right: 5px;
     height: 68px;
     line-height: 68px;
     }
-    .breadcrumb ul li a{
+    .breadcrumbs ul li a{
     color: #1b1b1b;
     }
     .section-item h3{
@@ -111,6 +111,17 @@
     background: #fff;
     border: none;
     }
+    .section-item .content .question-list:hover{
+    border: 1px solid #226ea2;
+    color: #255cb6;
+    }
+    .section-item .content .question-list:hover span{
+    color: #255cb6;
+    }
+    .section-item .content .question-list a.look:hover{
+    background: #1466cb;
+    color: #fff;
+    }
 </#macro>
 <@layout>
 <section id="banner" class="banner">
@@ -124,7 +135,7 @@
 </section>
 <!-- main 主内容 -->
 <section id="main" class="clearfix">
-    <div class="section-item breadcrumb">
+    <div class="section-item breadcrumbs">
         <div class="content">
             <ul>
                 <li><a href="">当前位置:</a></li>
@@ -141,7 +152,7 @@
             <#list contents as content>
                 <div class="question-list">
                     <span class="txt">${content.title!}</span>
-                    <span class="btn"><a href="${content.url!}">在线查看</a><a href="">下载文档</a></span>
+                    <span class="btn"><a href="${content.url!}" class="look">在线查看</a><a href="">下载文档</a></span>
                 </div>
             </#list>
             </@jp.contents>
@@ -154,7 +165,7 @@
             <#list contents as content>
                 <div class="question-list">
                     <span class="txt">${content.title!}</span>
-                    <span class="btn"><a href="${content.url!}">在线查看</a><a href="">下载文档</a></span>
+                    <span class="btn"><a href="${content.url!}" class="look">在线查看</a><a href="">下载文档</a></span>
                 </div>
             </#list>
             </@jp.contents>

jpress-web-template-usoftchina/src/main/webapp/templates/usoftchina/taxonomy_question.html

@@ -45,21 +45,21 @@
     text-align: center;
     overflow: hidden;
     }
-    .breadcrumb .content{
+    .breadcrumbs .content{
     text-align: left;
     }
-    .breadcrumb ul{
+    .breadcrumbs ul{
     overflow: hidden;
     display: inline-block;
     text-align: left;
     }
-    .breadcrumb ul li{
+    .breadcrumbs ul li{
     float: left;
     margin-right: 5px;
     height: 68px;
     line-height: 68px;
     }
-    .breadcrumb ul li a{
+    .breadcrumbs ul li a{
     color: #1b1b1b;
     }
     .section-item h3{
@@ -87,6 +87,8 @@
     }
     .section5 .content p a{
     color: red;
+    }
+    .section5 .content p a:hover{
     text-decoration: underline;
     }
     .section-item .content .left-txt{
@@ -102,6 +104,10 @@
     .section-item .content .right-img{
     float: right;
     }
+    .section-item .content .left-txt li:hover a{
+    color: #255cb6;
+    font-weight: bold;
+    }
 </#macro>
 <@layout>
 <section id="banner" class="banner">
@@ -115,7 +121,7 @@
 </section>
 <!-- main 主内容 -->
 <section id="main" class="clearfix">
-    <div class="section-item breadcrumb">
+    <div class="section-item breadcrumbs">
         <div class="content">
             <ul>
                 <li><a href="">当前位置:</a></li>
@@ -203,7 +209,7 @@
     <div class="section-item section5">
         <div class="content">
             <h2>仍有疑问？</h2>
-            <p>可拨打咨询电话800-830-1818，或点击 <a href="">联系我们</a>查看更多咨询方式。</p>
+            <p>可拨打咨询电话800-830-1818，或点击 <a href="contact">联系我们</a>查看更多咨询方式。</p>
         </div>
     </div>
 </section>